I have my component responsible for search input and stuff.
import { Component, Output, Input, EventEmitter } from '@angular/core';
@Component({
selector: 'header-lista',
templateUrl: './header-lista.component.html',
})
export class HeaderListaComponent {
@Input() pesquisar: string;
@Output() pesquisarChanged = new EventEmitter<string>();
public onPesquisarChanged() {
console.log('chamou');
this.pesquisarChanged.emit(this.pesquisar);
}
}
Each time something is typed my onPesquisarChanged
is activated.
I have my other component that is responsible for the list and for mounting the table.
import { Component, OnInit } from '@angular/core';
import { CidadeService } from './cidade.service';
@Component({
selector: 'ngx-lista-cidades',
templateUrl: './cidade.component.html',
providers: [ CidadeService ],
})
export class ListaCidadesComponent implements OnInit {
private cidades: object[];
private coluna: string;
private critererioBusca: string = '';
constructor(private cidadeService: CidadeService) {}
teste() {
console.log('aqui', this.critererioBusca);
}
ngOnInit() {
this.ListaTodasCidades();
}
private ListaTodasCidades() {
this.cidadeService.TodasCidades().then((response: object[]) => {
this.cidades = response.sort(function(a: any, b: any) {
return a.NOME < b.NOME ? -1 : a.NOME > b.NOME ? 1 : 0;
});
}, (error) => {
console.log(error);
});
}
private ordena(coluna) {
if (this.coluna === coluna) {
this.cidades.reverse();
} else {
this.cidades.sort((a, b) => {
return a[coluna] < b[coluna] ? -1 : a[coluna] > b[coluna] ? 1 : 0;
});
}
this.coluna = coluna;
}
}
The expected behavior would be to receive the value of @Input() pesquisar: string;
and with this value carry out the criterion pipe. It turns out that in the test method I have my critererioBusca
is always empty.
If I assign something to critererioBusca
it will be received by @Input() pesquisar: string;
, but the opposite path does not happen.
<header-lista [(pesquisar)]="critererioBusca"></header-lista>
What am I doing wrong?