Angular @Input不支持引导组件

我在我的Angular2类中犯了一个错误，但我并没有清楚地理解@Input。Angular @Input不支持引导组件

我创建了2个组件AppComponent和AppDetailComponent。

在AppDetailComponent：

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


@Component ({ 
selector: 'app-detail', 
template: 'Hi {{datainput}}' 
}) 

export class AppDetailComponent { 

@Input() 
datainput: string; 

}

和在AppComponent模板：

<h1> 
    {{title}} 
</h1> 
<app-detail [datainput]="'test'"></app-detail>

和在应用程序模块I由通过添加AppDetailComponent作为引导部件我除去

import { AppComponent } from './app.component'; 
import { AppDetailComponent } from './app-detail.component'; 

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

后一个错误从引导列表AppDetailComponent，程序工作正常。

我不明白为什么@input在使用它作为引导组件时不起作用？

尽管我发送来自其他角度分量的输入，角度总是会忽略输入属性？

来源

2017-02-23 user2930562

@Inputs()只能在组件的模板中绑定。自举组件在index.html以外的任何其他组件，因此它不可能绑定到输入。

也Angular 2 external inputs

看到，如果你不index.html有一个匹配的选择，并且不希望使用组件作为根组件，然后不要将其添加到bootstrap: [...]

来源

2017-02-23 10:09:20

我不知道我是否正确理解你。我没有在index.html中添加输入，而是在appComponent.html中声明为AppComponent的templateUrl – user2930562

为什么您将'AppDetailComponent'添加到'bootstrap：[]'然后呢？ –

谢谢。我犯了一个错误，但我想知道一个原因。我试图检查JavaScript文件，但我什么也没找到。 – user2930562

你需要仅引导AppComponent。

import { AppComponent } from './app.component'; 
import { AppDetailComponent } from './app-detail.component'; 

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

来源

2017-02-23 10:41:54

Angular @Input不支持引导组件

回答

相关问题