@Input屬性在角度2中未定義onInit

嘗試在構造函數或ngOnInit中獲取組件的@Input值。但它始終是「未定義的」。@Input屬性在角度2中未定義onInit

我用console.log更新了英雄plunker以顯示問題（測試版角度）。 http://plnkr.co/edit/dseNM7OTFi1VNG2Z4Oj5?p=preview

export class HeroDetailComponent implements OnInit { 
    constructor(){ 
    console.log('hero', this.hero) 
    } 
    public hero: Hero; 

    ngOnInit() { 
    console.log('hero', this.hero) 
    } 
}

我在做什麼錯在這裏？

來源

2015-12-21 eesdil

嗯，我並沒有意識到，在這個例子中，我們沒有選擇immidatelly英雄......我很高興，它不是在蹲在任何工作:)我檢查它在掠奪者，它工作正常。但是，在我的代碼中，它不能正常工作，但它已初始化......對於錯誤的重擊程序感到抱歉。我會接受答案，但它不能解決我的問題。 – eesdil

所以問題是，我已經把@Input ...中的camelCase屬性「inputProperty」，而不是「輸入屬性」...奇怪沒有意識到..但在API文檔中是這樣寫的。 – eesdil

你在ngOnInit得到未定義的原因是因爲在那裏部件被初始化，你還沒有真正在Hero對象

<my-hero-detail [hero]="selectedHero"></my-hero-detail>

通過此時selectedHero點在你的AppComponent沒有價值直到列表上的點擊事件調用onSelect方法

編輯：對不起，我沒有真正提供修復。如果添加ngIf到my-hero-detail

<my-hero-detail *ngIf="selectedHero" [hero]="selectedHero"></my-hero-detail>

你應該這樣會耽誤my-hero-detail組件的初始化，你應該看到控制檯輸出。然而這不會當所選英雄改變時再次輸出。

來源

2015-12-21 13:35:25 Zyzle

解決我的問題，所以thx。想想就行了，你可能會發現一些新的東西 – materliu

謝謝你。 – user2180794

這是因爲英雄是異步加載的，所以當視圖初始渲染時，選定的英雄是不確定的。但是在選擇後，英雄會被傳遞到具有定義值的細節視圖中。

您基本上只是看到基於原始值（未定義）的onInit調用。

如果你想類似的每次選擇後執行的東西，你可以修改它是這樣的：

export class HeroDetailComponent implements AfterViewChecked { 
    constructor(){ 
    console.log('hero', this.hero) 
    } 
    public hero: Hero; 

    ngAfterViewChecked() { 
    console.log('hero', this.hero) 
    } 
}

來源

2015-12-21 13:35:39 TGH

這應該是在頂部。謝謝！！！ – IvRRimUm

是的，它應該。 –

使用angular5。錯誤：ExpressionChangedAfterItHasBeenCheckedError：檢查後表達式已更改。先前的值：'未定義'。當前值：'[對象對象]'。 –

@Input屬性在角度2中未定義onInit

回答

相關問題