Quanto utilizamos (keyup)="filter = $event.target.value" ao atualizar a propriedade filter, o callback ngOnChanges não funciona.
Pelo que entendi, o ngOnChanges só 'funciona' com propriedades marcadas property-bound (ex. @Input). É isso mesmo?
No caso, se eu quiser ter controle do que aconetece quando o filtro é alterado eu teria de chamar um método ao invés de atribuir o filter diretamente no event binding?
Oii Tarcisio!
Fiz uns testes aqui e realmente o ngOnChanges só consegue detectar mudanças em propriedades do componente que estiverem decoradas com o @Input().
No caso que você cita, pelo que entendi em meus testes, o valor de filtro vai ter que ser passado para algum componente que espera receber este valor como uma "propriedade input", e então neste componente deverá ter o ngOnChanges.
Aqui está os código do teste que fiz:
app.component.ts
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
template: `
<input (keyup)="title = $event.target.value" type="search">
<app-test [text]='title'></app-test>
`,
styles: []
})
export class AppComponent {
title = '';
}
test.component.ts
import { Component, Input, OnChanges, SimpleChanges } from '@angular/core';
@Component({
selector: 'app-test',
template: `<h1>{{text}}</h1>`,
styles: []
})
export class TestComponent implements OnChanges {
@Input() text = '';
ngOnChanges(changes: SimpleChanges) {
console.log(changes);
}
}Veja se te ajuda a resolver a sua situação!
Abraços