1
resposta

Meu seletor não indica erro quando coloco o h1 dentro do mesmo

o meu vscode não indica erro quando coloco o H1 dento do seletor do component

1 resposta

Ola! Tem alguns motivos pra isso:

Componente já importado corretamente

Se você já adicionou o ContainerComponent no array de imports do seu AppComponent (como mostra no seu código), o Angular já reconhece essa tag como válida, então o VS Code não vai sublinhar.

Exemplo que evita o erro:

imports: [CommonModule, RouterOutlet, ContainerComponent],

Quando aparece o erro?

O erro aparece quando o Angular ainda não conhece o seletor <app-container>, por exemplo:

  • Você acabou de criar o componente, mas ainda não importou no imports do componente pai;
  • Ou está usando um componente que não está no mesmo módulo e não foi declarado nem exportado corretamente.

Suporte do Angular Language Service

Se você não estiver com a extensão Angular Language Service ativa ou instalada no VS Code, o editor não vai fazer esse tipo de verificação em tempo real. Sem ela, o VS Code trata <app-container> como qualquer tag HTML personalizada e não avisa sobre o erro até o build rodar.

Verifique se está instalada:

  1. Vá para a aba de extensões (ícone de quadrado com 4 blocos).
  2. Busque por Angular Language Service.
  3. Instale e reinicie o VS Code, se necessário.

Erro só no navegador

Mesmo que o VS Code não acuse erro visualmente, o Angular ainda pode acusar erro no console do navegador na hora da execução, caso o componente realmente não tenha sido importado corretamente.

É isso, abração!