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不支持引導組件

回答

相關問題