Olá Jean, tudo bem?
No arquivo nova-transferencia.component.ts
, o professor criou uma instância da classe EventEmitter, que é responsável por emitir e escutar eventos e está sendo usada com a diretiva @Output.
@Output() aoTransferir = new EventEmitter<any>();
Dessa forma, ao emitir um evento, através do método emit()
, há a propagação desses valores:
transferir() {
console.log('Solicitada nova transferência');
const valorEmitir = {valor: this.valor, destino: this.destino};
this.aoTransferir.emit(valorEmitir);
this.limparCampos();
}
Esses dados, por sua vez, podem ser acessados por outro componente, como nesse caso, estão sendo acessados pelo AppComponent
, devido à injeção de dependência que foi realizada:
constructor(private service: TransferenciaService) {}
Para que o AppComponent
pudesse enxergar esses dados, foram feitas duas alterações:
- um método denominado
transferir()
foi criado (tem o mesmo nome do método existente em nova-transferencia.component.ts
- talvez por isso a sua dúvida - mas poderia ter qualquer outro nome, ok?) - e no
app.component.html
foi criado um event binding para associar esse método criado ao @Output() aoTransferir
e assim, fazer os dados serem renderizados na tela.
<app-nova-transferencia (aoTransferir)="transferir($event)"></app-nova-transferencia>
Espero ter ajudado, até mais!