Gostaria de alterar a minha variável do component através de um método realizado no service. A variável aparece de true para false como desejado no console.log, mais não é alterada na variável fixada no component.
Variável a ser alterada: step0: boolean = true;
//SERVICE
import {
Injectable
} from '@angular/core';
@Injectable()
export class StepsService {
teste: string = 'texto de exemplo';
step0: boolean;
step1: boolean = true;
constructor() {}
proxStep1(): any {
this.step0 = false;
console.log(this.step0);
return this.step0;
}
msgAlerta(): void {
alert('Livro Angular 2 - Google - ' + this.teste);
}
}
//COMPONENT
import {
Component,
OnInit
} from '@angular/core';
import {
StepsService
} from '../steps.service';
@Component({
selector: 'app-step-0',
templateUrl: './step-0.component.html',
styleUrls: ['./step-0.component.css']
})
export class Step0Component implements OnInit {
step0: boolean = true;
constructor(public service: StepsService) {}
ngOnInit() {}
avancarStep1(): void {
this.service.proxStep1();
}
enviarMsg(): void {
this.service.msgAlerta();
}
}
//TEMPLATE
<section class="step step0" *ngIf="step0 == true">
<h2>Step-0 {{step0}}</h2>
<button (click)="avancarStep1()">Avançar</button>
<button (click)="enviarMsg()">Enviar Alerta</button>
</section>