在打字稿文件中獲取指令的輸入值

我傳遞給指令的輸入正確顯示在html文件中，但我沒有在打字稿文件中獲取它的值。如何在打字稿文件中訪問它？在打字稿文件中獲取指令的輸入值

下面是一個例子：

我有個指令，這在test-info.ts定義如下：

@Component({ 
selector: 'test-info', 
templateUrl: 'test-info.html' 
}) 
export class TestInfo { 
    @Input('location') location; 
    constructor(...) { 
    console.log('this.location: ' + this.location); //------> Prints null 
    }

內部test-info.html我有：

{{location}}

我內使用該指令另一個html user.html文件：

<test-info [location]='location'> </test-info>

位置在user.html中正確顯示，但.ts文件中的console.log命令打印爲空。

編輯： 在user.ts，位置是在Ajax調用分配。很可能這就是爲什麼構造函數或ngOnInit（）錯過了這個值。但是如何在更新時得到它？

來源

2017-08-06 Ari

這是因爲，你不能在構造函數中使用的輸入。你可以在'ngOnInit（）'中訪問這些輸入。它在第一次檢查僞指令的數據綁定屬性之後，以及在其任何子項被檢查之前調用。當指令被實例化時，它僅被調用一次。 – alexmac

我用'ngOnInit（）'和'ngAfterViewInit（）'得到了相同的結果。 – Ari

嘗試使用ngOnChanges掛鉤。如果你真的改變了正確的價值，那麼你應該得到它的鉤。

ngOnChanges() { 
    console.log('this.location: ' + this.location); 
}

另一種方式是在*ngIf包裝組件：

<test-info *ngIf="location" [location]='location'> </test-info>

來源

2017-08-06 19:37:26 yurzui

這對我來說並不安靜，因爲我有多個異步值。我最終將異步調用移動到測試信息文件。 – Ari

在打字稿文件中獲取指令的輸入值

回答

相關問題