0

Preciso fazer uma comunicação entre dois componentes. A partir de uma seleção (Primeiro Component), eu envio o ID para o outro componente, no ngOnInit eu recebo o valor desse ID (Segundo Component), porém quando tento usar ele em outra função (concluirCadastro()), dá Indefinid. O que posso fazer? Como resolver a questão?

Código disponível no: https://stackblitz.com/edit/angular-7rhqrp

No HTML do Primeiro Component

<h4>Selecionar Cidade</h4>
<mat-form-field>
  <mat-label>Cidade</mat-label>
  <mat-select (selectionChange)="cidadeSelecionada($event.value)">
    <mat-option *ngFor="let city of citys" [value]="city.Id">
      {{city.NomeCity}}
    </mat-option>
  </mat-select>
</mat-form-field>

<a [routerLink]="['/ParentChild2']">Selecionar</a>

No Component.ts do Primeiro Component

static emitirIdCidade = new EventEmitter<string>();

  citys: City[] = [
    {Id: 0, NomeCity: 'Belo Horizonte'},
    {Id: 1, NomeCity: 'Lavras'},
    {Id: 2, NomeCity: 'Rio de Janeiro'}
  ];


  cidadeSelecionada(event){
    ParentChildComponent.emitirIdCidade.emit(event);
  }

No HTML do Segundo Component

<button (click)="concluirCadastro()">Concluir Cadastro</button>

No Component.ts do Segundo Component

 ngOnInit() {
    ParentChildComponent.emitirIdCidade.subscribe(
      id => console.log(id)
    );
  }

  concluirCadastro() {
    console.log("teste novamente - " + this.cidadeId);
  }

Resultado Console.

0

teste novamente - undefined

2 Respostas 2

1

Ao invés de você chama a variável emitirIdCidade de forma estática [ParentChildComponent.emitirIdCidade.emit(event);]. Aconselho você a criar um Service, dentro dele você coloca sua variável EventEmitter e inicialize seu service nos dois componentes e faça sua ação desejada.

Dica: Ao invés de usar dessa forma com Service, use o Ngrx (Redux).

2
0

Bem, consegui resolver, porém via Link.

Segue a resposta:

https://stackblitz.com/edit/angular-xumrue

Se alguém conseguir algo da outra forma, postem por favor.

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .