Angular2:嵌套子组件不起作用
Angular2: Nesting a child component doesn't work
我已经用 angular 2 玩了几天了。我正在尝试将子选择器插入到父模板中。它应该足够简单,但我无法终生让它发挥作用。我收到以下错误:
“未处理的 Promise 拒绝:模板解析错误:
'child' 不是已知元素:"
我哪里错了?谁能帮我摆脱痛苦??
//app.module.ts
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
ChildModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
//app.component.ts
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
entryComponents: [ChildComponent]
})
export class AppComponent {
title = 'app works!';
}
<!-- app.component.html -->
<h1>
{{title}}
</h1>
<child></child>
//child.module.ts
@NgModule({
declarations:[ChildComponent]
})
export class ChildModule{}
//child.component.ts
@Component({
selector:'child',
templateUrl: './child.component.html'
})
export class ChildComponent{
}
<!-- child.component.html -->
<h1>child</h1>
您必须导出组件:
@NgModule({
declarations:[ChildComponent],
exports :[ChildComponent]
})
export class ChildModule{}
我已经用 angular 2 玩了几天了。我正在尝试将子选择器插入到父模板中。它应该足够简单,但我无法终生让它发挥作用。我收到以下错误:
“未处理的 Promise 拒绝:模板解析错误: 'child' 不是已知元素:"
我哪里错了?谁能帮我摆脱痛苦??
//app.module.ts
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
ChildModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
//app.component.ts
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
entryComponents: [ChildComponent]
})
export class AppComponent {
title = 'app works!';
}
<!-- app.component.html -->
<h1>
{{title}}
</h1>
<child></child>
//child.module.ts
@NgModule({
declarations:[ChildComponent]
})
export class ChildModule{}
//child.component.ts
@Component({
selector:'child',
templateUrl: './child.component.html'
})
export class ChildComponent{
}
<!-- child.component.html -->
<h1>child</h1>
您必须导出组件:
@NgModule({
declarations:[ChildComponent],
exports :[ChildComponent]
})
export class ChildModule{}