第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全，請及時綁定郵箱和手機立即綁定
已解決430363個問題，去搜搜看，總會有你想問的

為什么 ngOnChanges() 在 @Input() 更新數據 Angular 8 時不會觸發(fā)？

為什么 ngOnChanges() 在 @Input() 更新數據 Angular 8 時不會觸發(fā)？

慕哥6287543 2022-11-27 16:06:27
父組件.html<parent-comp [data]="mydata"> </parent-comp>父組件.tsthis.service.abc$        .takeUntil(this.ngUnsubscribe.asObservable())        .subscribe((data: myType[]) => {            this.mydata= data;        });子組件.ts@Input data;在類下我有下面的代碼public ngOnChanges() { if (this.data) { console.log(this.data); } }現在我希望每當我收到@Input data從父組件到子組件的最新數據時，我的ngOnChanges函數應該觸發(fā)并在控制臺中打印數據。但不幸ngOnChanges的是功能不會再次觸發(fā)。僅在組件初始化時觸發(fā)一次如果有人想要更多詳細信息，請告訴我！謝謝！
查看完整描述

5 回答

?
Smart貓小萌

TA貢獻1911條經驗 獲得超7個贊

鑒于缺乏進一步的信息，我會做出有根據的猜測，@Input data它是一個數組或一個對象。


根據文檔，ngOnChanges是：


當指令的任何數據綁定屬性更改時調用的生命周期掛鉤。


然而，它沒有說明應該如何更改屬性。一般來說，只有當對屬性的引用發(fā)生更改時才會觸發(fā)掛鉤。


考慮以下例如。


父組件控制器


mydata = [];


updateMyData(value: any) {

  this.mydata.push(value);

}

父組件模板


<app-child [data]="mydata"></app-child>

子組件控制器


@Input() data: any;


ngOnChanges(changes: SimpleChanges) {

  console.log(changes);

}

現在您希望ngOnChanges每次updateMyData()在父組件中調用該函數時都會觸發(fā)。但是對變量的引用mydata永遠不會改變。所以鉤子不會被觸發(fā)。有多種方法可以強制更改檢測器觸發(fā)掛鉤。


方法一：@Input將裝飾器 綁定到setter，而不是直接綁定變量。已經在答案中討論過。


方法二： 使用擴展語法在父組件中重新賦值變量。


父組件控制器


mydata = [];


updateMyData(value: any) {

  this.mydata = [...this.mydata, value];

}

您也可以對對象使用相同的方法。


查看完整回答
反對 回復 2022-11-27
?
慕桂英546537

TA貢獻1848條經驗 獲得超10個贊

感謝大家提供快速有效的解決方案。


我得到了解決方案，它與你們建議的不完全相同但相似。


在父組件中：


**Earlier I was assigning this way**

`this.mydata= data;`



**But now I am assigning in below way:**

`this.mydata= cloneDeep(data);`

注意：cloneDeep是從進口的lodash


查看完整回答
反對 回復 2022-11-27
?
搖曳的薔薇

TA貢獻1793條經驗 獲得超6個贊

NgOnChanges 只會在原始類型的輸入綁定屬性更改時觸發(fā)。這是因為必須更改對數據變量的引用才能注冊更改，以便您可以在此生命周期掛鉤中獲取它。

因此，實現此目的的可能方法是更改“mydata”變量的引用。mydata = [...mydata]比如，如果 mydata 變量是一個數組，或者mydata = {...mydata}它是來自父組件的一個對象，當它被改變時，分配一個新的引用給 mydata 變量。


查看完整回答
反對 回復 2022-11-27
?
守著一只汪

TA貢獻1872條經驗 獲得超4個贊

它可能是您傳遞的數據。如果它沒有改變，那么 ngOnChanges 將不會注冊任何更改。這是一個示例，您可以看到一個屬性是否多次更改，然后它只會在第一次更新時觸發(fā)，但如果您重新創(chuàng)建對象，它每次都會更改。（請參閱 stackblitz 中的控制臺日志）


https://stackblitz.com/edit/angular-ivy-qmb35h?file=src%2Fapp%2Fapp.component.html


你可以像我一樣做，每次都重新創(chuàng)建對象來繞過這個，或者更 hacky 的方法可能是保留一個你傳遞下來的虛擬“計數”變量，并在每次你想要子組件注冊時遞增它改變。


查看完整回答
反對 回復 2022-11-27
?
叮當貓咪

TA貢獻1776條經驗 獲得超12個贊

您可以在角度中對@Input 使用setter 和getter 方法。請參考以下行以供參考：


private _data: any;

  @Input()

  set data(data) {

    this._data = data;

    console.log(this._data);

  };

僅從 setter 方法，您也可以調用任何其他方法，并且可以從那里運行您想要的任何邏輯。


查看完整回答
反對 回復 2022-11-27
  • 5 回答
  • 0 關注
  • 230 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優(yōu)惠詳情

 幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

 公眾號

掃描二維碼
關注慕課網微信公眾號