Hola tengo el siguiente codigo para filtrar una tabla mat-table ``` export class ArticuloComponent implements OnInit { public selcat:categoria={idcategoria:0,nombrecategoria:''}; public categorias!:any; public subcategorias!:any[]; public categorySelection:any; public lstfiltrado!:any[]; public value2:any; public lst!: any; public lsts!: any; public filtroForm:any; public columnas : string[]=["nombreProducto","precio","stock","categoria","subcategoria","marca",'actions']; constructor( private apicategoria : ApicategoriaService, private apisubcategoria : ApisubcategoriaService, private apiArticulo : ApiarticuloService, private dialog:MatDialog, public snackBar:MatSnackBar, ) { } @ViewChild(MatSort, { static: false }) sort!: MatSort; @ViewChild(MatPaginator) paginator!: MatPaginator; @ViewChild('categoriaSelect') someRef!: MatSelect; @ViewChild('subCatSelect') sc!: MatSelect; categoriaSelect = new FormControl(''); subCatSelect = new FormControl(''); filterValues: any = { category: '', subcat: '' } ngAfterViewInit(): void { //this.someRef.focus(); } private fieldListener() { this.categoriaSelect.valueChanges .subscribe( categoria => { this.filterValues.category = categoria; this.lst.filter = JSON.stringify(this.filterValues); console.log(); this.changeCategory(categoria.idCategoria); } ) this.subCatSelect.valueChanges .subscribe( subcat => { this.filterValues.subcat = subcat; this.lst.filter = JSON.stringify(this.filterValues); } ) } private createFilter(): (articulo:articulo, filter: string) => boolean { let filterFunction = function (articulo:articulo, filter:string): boolean { let searchTerms = JSON.parse(filter); return articulo.idcategoria === searchTerms.category && articulo.idsubcategoria === searchTerms.subcat; } return filterFunction; } clearFilter() { this.subCatSelect.setValue(''); this.categoriaSelect.setValue(''); } changeCategory(event: number) { this.lsts=this.subcategorias.filter(item=>item.idCategoria===event); this.sc.focus(); } changesCategory(event: number) { this.lst.filter((item: any)=>item.id_subcategoria===event); } getcategoria(){ this.apicategoria.getCategorias().subscribe(resp=>{ this.categorias = resp.data; }); } ngOnInit(): void { this.getArticulos(); this.getcategoria(); this.getsubcategorias(); this.fieldListener(); } getsubcategorias() { this.apisubcategoria.getsubcategorias().subscribe(resp=>{ this.subcategorias = resp.data; }); } getArticulos(){ this.apiArticulo.getArticulos().subscribe(resp=>{ this.lst = new MatTableDataSource<articulo>(resp.data); this.lst.sortingDataAccessor = (item:any, property:any) => { return item[property].toLocaleLowerCase(); }; this.lst.sort = this.sort; this.lst.paginator = this.paginator; this.lst.filterPredicate = this.createFilter(); }); } resetFilters() { this.categorias.filter = ""; } } ``` Es decir tengo dos mat select categoria y subcategoria respectivamente, al seleccionar una categoria se filtran las subcategorias, esto va perfecto. Pero quiero que tambien se filtren los articulos de dicha categoria, y luego al seleccionar la subcategoria se vuelva a filtrarlos articulos. El caso es que el array que me devuelve el servicio es decir los articulos contiene: el idCategoria, y el nombreCategoria, asi como el idsubcateogria y el nombreSubCategoria. lo que hice fue seguir el tutorial: [https://careydevelopment.us/blog/how-to-filter-on-specific-columns-with-filterpredicate-in-an-angular-material-table][1] [1]: https://careydevelopment.us/blog/how-to-filter-on-specific-columns-with-filterpredicate-in-an-angular-material-table Pero no funciona la tabla se vacia al seleccionar una categoria.