Skip to main content
1 de 2

Angular 2 - Alterar variável do Component pela variável do Service

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>