Angular 2 - MEAN MongoDB NodeJS

Question

Ich benutze dieses GitHub Beispiel (https://github.com/bradtraversy/mean_mytasklist) und es funktioniert soweit gut. Ich sehe die Aufgaben meiner MongoDB, kann Aufgaben hinzufügen, löschen.

Dann habe ich versucht, eine neue Komponente "Header" in meinem app.modules.ts

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

@Component({ 
    moduleId: module.id, 
    selector: 'headers', 
    templateUrl: 'header.component.html' 
}) 
export class HeaderComponent { 

} 

Ich habe in meinem app.component.html

import { NgModule } from '@angular/core'; 
import { BrowserModule } from '@angular/platform-browser'; 
import { HttpModule } from '@angular/http'; 
import { FormsModule } from '@angular/forms'; 
import { AppComponent } from './app.component'; 
import { TasksComponent } from './components/tasks/tasks.component'; 
import { HeaderComponent } from './components/header/header.component'; 

@NgModule({ 
    imports: [BrowserModule, HttpModule, FormsModule], 
    declarations: [AppComponent, TasksComponent, HeaderComponent], 
    bootstrap: [AppComponent] 
}) 
export class AppModule { } 

diese Komponente hinzufügen Ich bin Verwenden Sie diesen Selektor.

<div class="container"> 
    <headers></headers> 
    <h1>MyTaskList</h1> 
    <hr> 
    <tasks></tasks> 
</div> 

Nach meinem Browser aktualisieren werde ich diese Fehlermeldung:

zone.js: 420 Unbehandelte Versprechen Ablehnung: Template Parse-Fehler: 'Header' ist kein bekanntes Element: 1. Wenn "Headers" ist eine Angular-Komponente, dann vergewissern Sie sich, dass es Teil dieses Moduls ist. 2. Wenn 'Kopfzeilen' eine Web-Komponente ist, dann fügen Sie "CUSTOM_ELEMENTS_SCHEMA" den '@ NgModule.schemas' dieser Komponente hinzu, um diese Nachricht zu unterdrücken. ("? [ERROR ->]

<headers></headers> 
<h1>MyTaskList</h1> 
<hr> 

Irgendwelche Ideen Vielen Dank !!!

"): AppComponent @ 1: 4; Zone: ; Aufgabe: Versprechen.dann;

Answer 1

Welche Version von Angular 2 verwenden Sie? & Sie verwenden kein Webpack für Build?

Die Lösung wird in der Fehlerkonsole selbst erwähnt. Sie müssen hinzufügen

schemas: [CUSTOM_ELEMENTS_SCHEMA ] 

So Ihre app.module.ts etwa so aussehen sollte,

import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core'; 

@NgModule({ 
    imports: [BrowserModule, HttpModule, FormsModule], 
    declarations: [AppComponent, TasksComponent, HeaderComponent], 
    bootstrap: [AppComponent], 
    schemas: [CUSTOM_ELEMENTS_SCHEMA ] 
})