angular中利用ViewChild傳遞數據

在項目中，有些可以公用的組件，一般我們就抽離出來，然後在需要用到的頁面，再引入進來。那麼，當我們不僅僅需要共用組件的UI顯示，還需要用到組件裏的變量時，我們就可以用viewchild來獲取。具體做法如下：

一、確認page.component.ts中正確引入組件：

二：在page.component.ts中，引用：

 @ViewChild(CommonComponent)  common;

三、在需要的地方，調用數據：

console.log(this.common);

這樣，就可以在page.component.ts拿到我們需要的數據。

需要注意的一點是，一定要在ngAfterViewInit後，才能正確拿到組件數據。官方文檔是這麼說明的：

View queries are set before the ngAfterViewInit callback is called.

在調用 NgAfterViewInit 回調函數之前就會設置這些視圖查詢。