Angular 2 - MEAN MongoDB NodeJS

我使用這個GitHub的例子（https://github.com/bradtraversy/mean_mytasklist），它迄今爲止工作正常。我看到我的MongoDB的任務，可以添加，刪除任務。Angular 2 - MEAN MongoDB NodeJS

然後我試圖添加新的組件「頭」

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

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

}

我在app.modules.ts添加這個組件

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 { }

在我app.component.html我使用這個選擇器。

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

刷新瀏覽器後，我會收到此錯誤信息：

zone.js：420未處理的承諾拒絕：模板解析錯誤：「頭」不是一個已知的元素： 1.如果'headers'是一個Angular組件，然後驗證它是否是該模塊的一部分。 2.如果'headers'是一個Web組件，那麼將「CUSTOM_ELEMENTS_SCHEMA」添加到此組件的'@ NgModule.schemas'中以禁止此消息。（「？ [ERROR - >]

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

任何想法非常感謝!!!

」）：AppComponent @ 1：4;區域：;任務：Promise.then;

來源

2017-02-12 S. Gruender

你正在使用哪個版本的Angular 2 &你沒有使用webpack進行構建？

解決方案在錯誤控制檯本身中提及。您需要添加

schemas: [CUSTOM_ELEMENTS_SCHEMA ]

所以你應該app.module.ts這個樣子，

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

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

來源

2017-02-12 15:40:08

感謝您的回覆，但我仍然得到同樣的錯誤。 CUSTOM_ELEMENTS_SCHEMA允許 - >名稱中帶有 - 的所有非角元素和 - 元素中帶有 - 的 - 名稱中的任何屬性，這是自定義元素的常用規則（https://angular.io /docs/ts/latest/api/core/index/CUSTOM_ELEMENTS_SCHEMA-let.html）。我只使用「標題」作爲選擇器。令我驚訝的是，任務組件（請參閱GitHub示例）正在工作。 –

我想你是在正確的道路上。看來我正在使用舊版的Angular。有一個bugreport描述了我的問題（https://github.com/angular/angular/issues/11426）。我在哪裏可以查看我的版本？我如何更新我的Angular？謝謝！！！ –

嘗試將您的組件選擇器更改爲自定義標頭，如果它適合您。檢查你的package.json的角度版本。 –

Angular 2 - MEAN MongoDB NodeJS

回答

相關問題