Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

Sincronização de dados entre componetes (pai -> filho)

Eu tenho 2 componetes o tradicional pai e filho ou seja, o pais passa informações para o filho. Eu estou com um problema de sincronização de informações, a renderização do filho ocorre primeiro que os dados do pai seja recuperados do back-end.

Conforme a imagem abaixo, o evento ngOnInit do filho ocorre sem antes que o ngOnInit do PAI tenha concluído (recuperar dados do servidor). O projeto abaixo não é de nenhum curso da Alura, porém, ao fazer os cursos não encontrei ou não entendi como resolver meu problema com o conteúdo dos cursos, provavelmente está lá rsrs, só não sei onde... já assisti a todos e não conseguir achar resposta....

Para passar as informações do pai para o filho estou usando a anotação @Input.

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

1 resposta
solução!

Olá Jefferson!

O Angular realiza a detecção de mudanças e atualiza a view de forma síncrona, mas o carregamento de dados assíncronos (como os vindos de um back-end) pode não estar sincronizado com o ciclo de vida dos componentes.

Uma maneira de resolver esse problema é utilizando o ngOnChanges no componente filho, que é um hook do ciclo de vida que é chamado quando um valor de um @Input é atualizado. Dessa forma, mesmo que o ngOnInit do componente filho seja chamado antes de os dados estarem prontos, o ngOnChanges será chamado assim que o dado for recebido pelo componente pai e passado para o filho.

Deixo aqui a documentação que pode melhor guiar você para contornar essa situação:

Espero ter ajudado ao menos a dar um norte, no qual você pode explorar e reforço que em casos de dúvidas, conte sempre com o fórum da comunidade Alura! Bons estudos!

Sucesso

Um grande abraço e até mais!

Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓. Bons Estudos!