I have a simple component:
@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);
}
}
It's template:
<div *ngFor="let item of _items">
{{item}}
</div>
<input type='text' (change)='onChangeValue($event)'>
Question:
Why the setter @Input() set items(..) is being called after the text has been changed in the input element and the onChangeValue function is called.
I thought Angular's change detection strategy OnPush will trigger the @Input() set items(..) function if and only if the parent component passes in a new reference of items to this component.
However, @Input() set items(..) is also triggered when the input text has changed.
Why??
