angular2：ngOnChangesは呼び出されませんが、正しく表示が変更されます

Question

私のコンポーネントには可変オブジェクト入力があります。オブジェクトのプロパティが変更された場合、コンポーネントのngOnChangesは呼び出されません。簡単に分かります。しかし、ディスプレイは正しく変更されました。

マイコンポーネントhero-card：

export class HeroCardComponent implements OnChanges , DoCheck { 
    @Input() 
    Hero: Hero; 
    @Input() 
    Title: string; 
    ngOnChanges(changes: SimpleChanges) { 
     for (const propName in changes) { 
      const chng = changes[propName]; 
      const cur = JSON.stringify(chng.currentValue); 
      const prev = JSON.stringify(chng.previousValue); 
      console.log(`${propName}: currentValue = ${cur}, previousValue = ${prev}`); 
     } 
    } 

} 

それはテンプレートです：

{{Title}}<br> 
Hero title : {{Hero.title}}<br> 
Hero name : {{Hero.name}}<br> 

私はhero.nameと結合する双方向を持っている入力にhero.nameを変更しました。

角度が実際に変更を確認できましたか？

変更されたオブジェクトでも表示が変更されたように見えます。はい、素晴らしいです！

ただし、ngOnChangesは呼び出されません。それは角度が変化をチェックしていないようだった。変更しても反映しなくても、すべてのビューをリセットすることができます。

私に真実を伝える人はありますか？ありがとう！

Answer 1

角トラックは参照によって入力バインドされ、Heroオブジェクトへの参照は変更されていないため、ngOnChangesはトリガーされません。これは、Angularがのの変更を検出していないことを意味します。Heroオブジェクト参照です。そして、この変更のチェックは、の角度がで、HeroCardComponentでない場合、実際に実行されます。

ただし、テンプレートには、次を使用します。

Hero name : {{Hero.name}}<br> 

毎回角度の実行は、それがHero.nameが変更されたかどうかを確認する必要がありHeroCardComponentコンポーネントの検出を変更することを意味しています。実際にはHeroオブジェクト参照のチェックに関連していません。角度がHeroCardComponentコンポーネントの変更検出を実行しているときに発生します。 DOMで使用される式が異なる値を評価する場合は、domを更新します。 The mechanics of DOM updates in AngularでDOMの更新について詳しく読むことができます。

オブジェクトの変異を自分で追跡したい場合は、ngDoCheckライフサイクルフックを使用できます。詳細は、記事If you think ngDoCheck means your component is being checked — read this articleで説明しています。あなたが読むべき変化検出の詳細については

：

• Angular’s $digest is reborn in the newer version of Angular
• Everything you need to know about change detection in Angular