アンギュラ4 - HTML入力要素変更イベントは、OnPush戦略@Input（）セッターをトリガー

Question

私は単純なコンポーネントがあります。

<div *ngFor="let item of _items"> 
    {{item}} 
</div> 

<input type='text' (change)='onChangeValue($event)'> 

質問：

@Component({ 
    // ... 
    changeDetection: ChangeDetectionStrategy.OnPush 
}) 
export class MyComponent { 

    private _items: string[]; 

    @Input() 
    set items(items) { 
    console.log('setter of items: ', items); // verify call 
    this._items = items; 
    } 

    onChangeValue(event) { 
    console.log('on change value', event); 
    } 
} 

それはテンプレートですが。
なぜテキストが変更された後にセッター@Input() set items(..)が呼び出されているのですか？ input要素とonChangeValue関数が呼び出されます。

Angularの変更検出戦略OnPushは、@Input() set items(..)ファンクションif and only ifをトリガーすると考えました。親コンポーネントは、このコンポーネントにアイテムの新しい参照を渡します。

ただし、@Input() set items(..)は、入力テキストが変更されたときにトリガーされます。

なぜですか??

Answer 1

としてはthis S.O. postで説明：

OnPushがこのように定義されています。

コンポーネントがとき

を受けたためにリッスンするときのDOMイベントこれは、変化検出

1. をトリガー| @Input（）が変化検出によって更新されたときに非同期パイプが新しいイベント
2. を受け取ります。
3. 明示的ChangeDetectionStrategy.DefaultはAngularsゾーン内と呼ばれるすべての 非同期コールバックのための変化検出をトリガ（すべてのDOMも内 に耳を傾け

ChangeDetectorRef :: markForCheckを使用して次の変更検出ターンをチェックするコンポーネントを登録しますだから、角度アプリケーション、すべての観察可能なイベントまたは完了 約束、のsetTimeout、...）

は、あなたのケースでは、変化検出は、コンポーネントが待機するDOMイベントによってトリガされています。