Skip to main content
1 de 2
Caruso
  • 921
  • 15
  • 28

Como concatenar filtros con combineLatest en Angular

con la siguiente funcion logro filtrar solo por un campo input que es el nombre de producto:

ngAfterViewInit(): void {

   this.articulosFiltrado$ = combineLatest(
     this.apiArticulo.getArticulos(),
     this.nombreProducto.valueChanges.pipe(
       startWith(''),
       debounceTime(300)
     ),
     this.categoriaSelect.valueChanges.pipe(
       startWith(''),
       debounceTime(300)
     ),
   ).pipe(
     map(([list, name]) => {
       let nameTerm: string = name.trim().toLowerCase();
       
       const completeList: articulo[] = [...list.data];
       let filteredByName: articulo[] = [];
      
       filteredByName = completeList.filter(item => {
         if (name === '') return true;
         return item.nombreProducto.toLowerCase().includes(nameTerm);
         
       }).concat()
       return filteredByName
      
     }),
    
  
     
     tap(res => {
       this.productsDataSource.data = res;
     })
   )
}

el caso es que quiero usar combineLatest para utilizar varios filtros a la vez sobre la tabla de articulos. Ademas del input nombre de producto de arriba tengo un mat select de categoria, pero no logro unificar ambos:

  ngAfterViewInit(): void {
    this.someRef.focus();
    this.articulosFiltrado$ = combineLatest(
      this.apiArticulo.getArticulos(),
      this.nombreProducto.valueChanges.pipe(
        startWith(''),
        debounceTime(300)
      ),
      this.categoriaSelect.valueChanges.pipe(
        startWith(''),
        debounceTime(300)
      ),
    ).pipe(
      map(([list, name]) => {
        let nameTerm: string = name.trim().toLowerCase();
        
        const completeList: articulo[] = [...list.data];
        let filteredByName: articulo[] = [];
       
        filteredByName = completeList.filter(item => {
          if (name === '') return true;
          return item.NombreProducto.toLowerCase().includes(nameTerm);
          
        }).concat()
        let idC: number =  this.categoriaSelect.value;
  
        let filteredbyCategory: articulo[] = [];
        filteredbyCategory = completeList.filter(item => {
        
          return item.Id_categoria==idC;
          
        }).concat()
  
        return filteredbyCategory
   
       
      }),
     
   
      
      tap(res => {
        this.productsDataSource.data = res;
      })
    )
}

es decir si devuelvo filteredbyCategory solo filtra por categoria, y sino solo por nombre, no se que me esta faltando hacer en el codigo.

Caruso
  • 921
  • 15
  • 28