ERRO: this.emailInput está undefined | Angular parte 2: Autenticação, Forms e lazy loading

Solucionado (ver solução)

Solucionado
(ver solução)

2
respostas

Referente ao curso Angular parte 2: Autenticação, Forms e lazy loading, no capítulo Rotas filhas e lazy loading e atividade Rotas filhas

por Estudante

| 24.2k xp | 6 posts

Saudações a todos!

Fiz a construção de rotas filhas, aplicando 100% da mesma lógica feita pelo Flávio no vídeo, na página '/signup' é retornado o seguinte erro do Angular, após implementar a funcionalidade de auto-focus (feito igual a página '/signin'):

ERROR Error: Uncaught (in promise): TypeError: this.emailInput is undefined ERRO ( Mais detalhes do código, prints em anexo abaixo:

signup.component.ts

signup.component.html

signup.component.ts signin.component.ts

Please, caso alguém tenha passado por esse erro, ou possa me ajudar a entender a solução, fico agradecido desde já!

Thanks!

2 respostas

solução!

por dennys winslow de menezes arantes

| 182.9k xp | 17 posts

11/07/2021

Mihainuan de Sá, tudo bem!?

O "problema" está relacionado à versão do Angular. Provavelmente, assim como eu, você deve estar utilizando uma versão mais nova que o Flavio usou no curso.

Para resolver a questão, faça o seguinte:

1- Na classe Sigin e/ou SigupComponent, importe AfterViewInit do pacote @angular/core; 2- Retire o trecho de código do ngOnInit() e o coloque no método ngAfterViewInit(): ngAfterViewInit(){ // método usado para dar foco ao emailInput ao carregar a página if (this.detectorPlataformaService.ehNavegador()){ this.emailInput.nativeElement.focus(); } }

Isso deve ser o bastante.

por Estudante

| 24.2k xp | 6 posts

12/07/2021

Fala Denny Winslow! Tudo bem aqui! Agradeço demais pelo feedback com a solução para a situação ocorrida em minha experiência.

Segui seus passos conforme orientou, inserindo as 2 linhas de código dentro do método ngAfterViewInit(), em signup.component.ts e signin.componsnt.ts, solucionando o erro apresentado. Desse modo a aplicação Angular agora funciona 100% na funcionalidade de auto-focus nas páginas, conforme lecionado nos vídeos.

Muito obrigado por compartilhar sua visão e solução adequada para o erro apresentado.

Muito sucesso!!