O código finalizado do curso esta diferente do github, esta faltando, por exemplo, os código com o Observable, no qual quando o instrutor começou a utilizar, minha aplicação não renderiza mais a lista de transferências na pagina de extratos.
Solucionado
O código finalizado do curso esta diferente do github, esta faltando, por exemplo, os código com o Observable, no qual quando o instrutor começou a utilizar, minha aplicação não renderiza mais a lista de transferências na pagina de extratos.
hoje, com a Alura e o Google Gemini
O mesmo ocorre comigo, após tentar debugar, ele informa que não é possível iterar sobre um objeto.
Imagino que o erro possa estar sobre o extrato.component.html, pois o professor trocou no arquivo extrato.component.ts de this.transferencias para transferencias$: Observable<Transferencia[]>;
Logo a correção precisaria ser refletida no arquivo html do extrato no qual o professor não mencionou em aula, Tentei colocar no ngIf: <tbody *ngIf="!!transferencias$; else listaVazia"> porém como o erro mostra ele é um objeto não sendo possível iterar sobre...
Na lógica cheguei até ai rs, também estou no aguardo de um auxílio... Infelizmente o código do professor no github não está atualizado, senão eu compararia para corrigir.
Olá Alan, muito obrigado pelo seu feedback. Esse detalhe realmente passou batido.
Podemos resolver o código como o Ramon pontuou, com um adicional que é a utilização do pipe async. O pipe async possibilitará você exibir o resultado de um observable na tela quando houver uma resposta válida e além disso cuidará de desinscrever quando a tela for destruída.
Mas para que esse mecânismo possa funcionar, no arquivo extrato.component.html altere de:
<tbody *ngIf="!!transferencias; else listaVazia">
para:
<tbody *ngIf="transferencias$ | async as transferencias; else listaVazia">
Vou refletir essas alterações no repositório, mais uma vez muito obrigado e bons estudos!
so uma correção é AsyncPipe para achar na documentação do angular io: The async pipe subscribes to an Observable or Promise and returns the latest value it has emitted. When a new value is emitted, the async pipe marks the component to be checked for changes. When the component gets destroyed, the async pipe unsubscribes automatically to avoid potential memory leaks . https://angular.io/api/common/AsyncPipe