Solucionado (ver solução)
Solucionado
(ver solução)
5
respostas

Erro ao tentar achar componente

Olá, Boa noite!

Estou tentando fazer o módulo foto da aula 2, porém ele apresenta erro utilizando o caminho relativo da pasta e também usando module.id.

Log do Erro:

zone.js:344 Unhandled Promise rejection: Template parse errors:
'foto' is not a known element:
1. If 'foto' is an Angular component, then verify that it is part of this module.
2. If 'foto' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schema' of this component to suppress this message. ("
</div>
<div class="container">
    [ERROR ->]<foto></foto>
</div>"): AppComponent@4:4 ; Zone: <root> ; Task: Promise.then ; Value: Error: Template parse errors:(…) Error: Template parse errors:
'foto' is not a known element:
1. If 'foto' is an Angular component, then verify that it is part of this module.
2. If 'foto' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schema' of this component to suppress this message. ("
</div>
<div class="container">
    [ERROR ->]<foto></foto>
</div>"): AppComponent@4:4
    at TemplateParser.parse (http://localhost:3000/node_modules/@angular/compiler/bundles/compiler.umd.js:8530:21)
    at RuntimeCompiler._compileTemplate (http://localhost:3000/node_modules/@angular/compiler/bundles/compiler.umd.js:16905:53)
    at eval (http://localhost:3000/node_modules/@angular/compiler/bundles/compiler.umd.js:16828:85)
    at Set.forEach (native)
    at compile (http://localhost:3000/node_modules/@angular/compiler/bundles/compiler.umd.js:16828:49)
    at ZoneDelegate.invoke (http://localhost:3000/node_modules/zone.js/dist/zone.js:192:28)
    at Zone.run (http://localhost:3000/node_modules/zone.js/dist/zone.js:85:43)
    at http://localhost:3000/node_modules/zone.js/dist/zone.js:451:57
    at ZoneDelegate.invokeTask (http://localhost:3000/node_modules/zone.js/dist/zone.js:225:37)
    at Zone.runTask (http://localhost:3000/node_modules/zone.js/dist/zone.js:125:47)consoleError @ zone.js:344
zone.js:346 Error: Uncaught (in promise): Error: Template parse errors:(…)consoleError @ zone.js:346


zone.js:346 Error: Uncaught (in promise): Error: Template parse errors:(…)consoleError @ zone.js:346

Arquivos

app.module.ts:

import {NgModule} from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import {AppComponent} from './app.component';
import { FotoModule } from './foto/foto.module'

@NgModule({
    imports: [ BrowserModule, FotoModule],
    declarations: [AppComponent],
    bootstrap: [AppComponent]
})


export class AppModule{}

app.component.ts

import { Component } from '@angular/core';

@Component({

    moduleId: module.id,
    selector: 'app',
    templateUrl:'./app/app.component.html'
})
export class AppComponent { }

foto.component.ts

import { Component } from '@angular/core';

@Component({

    moduleId: module.id,
    selector: 'foto',
    templateUrl: './foto.component.html'
})

export class FotoComponent{}

Todos os arquivos referente ao componente foto estão dentro da pasta foto: foto.component.ts , foto.module.ts e foto.component.html

O servidor está rodando e os arquivos .ts estão sendo compilados via npm start

5 respostas

Compartilhe o código do módulo de fotos.

Código???? :)

Desculpe, estou trabalhando a noite posto o código sem falta :)

Desculpe, a demora :/

Código módulo de fotos:

import { NgModule }      from '@angular/core';
import { FotoComponent }   from './foto.component';

@NgModule({
  declarations: [ FotoComponent ],
  exports: [FotoComponent]
})
export class FotoModule { }
solução!

Obrigada Flávio, achei o erro. Faltava o module.id no foto.component , ele estava apenas no app.component.