Filtrer plus d'une valeur avec ngx-filter-pipe angular

Question

J'utilise ngx-filter-pipe avec angulaire 4 et je suis bloqué par ce problème. j'ai réussi à filtrer avec une valeur et maintenant im essayant de filtrer les données avec plus d'une valeur: Voici ce que je suis arrivé Ceci est mon élément:

@Component({ 
    selector: 'deudas-list', 
    templateUrl: '../views/deudas-list.html', 
    providers: [ DeudaService ] 
}) 
export class DeudasListComponent{ 
    public titulo: string; 
    public deudas: Deuda[]; 
    public userFilter: any = { mes: '' }; 

    constructor(
     private _route: ActivatedRoute, 
     private _router: Router, 
     private _productoService: DeudaService 
) { 
    this.titulo = 'Listado de Pagos:'; 
    } 

    ngOnInit() { 
    this._productoService.getDeudas().subscribe(
     result =>{ 
      console.log(result['Cuotas'].Cuota); 
      this.deudas = result['Cuotas'].Cuota; 
     }, 
     error => { 
     console.log(<any>error); 
     } 
    ); 
    } 
} 

Ceci est mon avis

<div class="form-group has-feedback"> 
    <label for="term" class="sr-only">Search</label> 
    <input type="text" name="term" [(ngModel)]="userFilter.mes" class="form-control" id="term" placeholder="Buscar por mes..."> 
    <span class="glyphicon glyphicon-search form-control-feedback"></span> 
</div> 
<div *ngIf="deudas" class="table-responsive col-lg-12 tablilla"> 
    <table class="table table-bordered table-striped table-responsive"> 
    <tbody> 
     <tr *ngFor="let deuda of deudas | filterBy: userFilter | paginate: {itemsPerPage:10,currentPage: p}"> 
     <td>{{deuda.nombre_edificio}}</td> 
     <td>{{deuda.numero_dpto}}</td> 
     <td>{{deuda.Annio}}</td> 
     <td>{{deuda.mes}}</td> 
     <td>{{deuda.nombre_tipo_cuota}}</td> 
     <td>{{deuda.monto_cuota}}</td> 
     <td>{{deuda.nombre_estado_cuota}}</td> 
     <td>{{deuda.fecha_pago}}</td> 
     </tr> 
    </tbody> 
    </table> 
    <pagination-controls (pageChange)="p = $event" class="paginador"></pagination-controls> 
</div> 

J'ai essayé plusieurs choses mais je ne peux pas le faire fonctionner Voici la documentation que je suis https://github.com/VadimDez/ngx-filter-pipe Je ne peux pas obtenir $ ou filtre pour fonctionner comme indiqué

Ce sont les données que je reçois d'un ws

comme vous pouvez le voir im en utilisant mes pour filtrer mais je voudrais utiliser plus d'un <input type="text" name="term" [(ngModel)]="userFilter.mes" class="form-control" id="term" placeholder="Buscar por mes...">

tout l'aide serait appréciée.

Answer 1

si vous utilisez même type de données pour filtrer une valeur que vous pouvez le faire en même filtre mais si vous voulez un résultat différent, vous pouvez utiliser si les conditions d'autre ou de l'aiguillage pour résultat différent que vos besoins

import { Pipe, PipeTransform } from '@angular/core'; 
 
@Pipe({ 
 
    name: 'CurrencyFilter', 
 
    pure: false 
 
}) 
 
export class CurrencyFilterPipe implements PipeTransform { 
 
    transform(items: number): any { 
 
     var OrigionalValue = items; 
 
     var franctionCount = parseInt(abp.session.crNoOfDgtsAftrDecimal); 
 
     var value = items.toFixed(franctionCount); 
 
     var commaSaperatedVal = value.replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1" + abp.session.crDgtGrpSymbol + ""); 
 
     var selectedSymbol = abp.session.crCurrencySymbol; 
 
     var selectedSymbol = ""; 
 
     var PosCurrFormat = abp.session.crPositivCurrencyFrmt; 
 
     var NgtvCurrFormat = abp.session.crNagativeCurrencyFrmt; 
 
     var FinalValue; 
 
     if (items > 0) 
 
     { 
 
      switch (PosCurrFormat) { 
 
       case "$1.1": 
 
        FinalValue = selectedSymbol + commaSaperatedVal; 
 
        break; 
 
       case "1.1$": 
 
        FinalValue = commaSaperatedVal + selectedSymbol ; 
 
        break; 
 
       case "$ 1.1": 
 
        FinalValue = selectedSymbol+" "+ commaSaperatedVal; 
 
        break; 
 
       case "1.1 $": 
 
        FinalValue = commaSaperatedVal + " " + selectedSymbol; 
 
        break; 
 
      } 
 
      return FinalValue 
 
     } 
 
     if (items < 0) { 
 
      commaSaperatedVal = commaSaperatedVal.replace('-','') 
 
      switch (NgtvCurrFormat) { 
 
       case "($1.1)": FinalValue = "("+selectedSymbol + commaSaperatedVal+")"; break; 
 
       case "-$1.1": FinalValue = "-"+selectedSymbol + commaSaperatedVal; break; 
 
       case "$-1.1": FinalValue = selectedSymbol + "-"+ commaSaperatedVal; break; 
 
       case "$1.1-": FinalValue = selectedSymbol + commaSaperatedVal + "-" ; break; 
 
       case "(1.1$)": FinalValue = "(" + commaSaperatedVal + selectedSymbol + ")"; break; 
 
       case "-1.1$": FinalValue = "-" + commaSaperatedVal + selectedSymbol; break; 
 
       case "1.1-$": FinalValue = commaSaperatedVal + "-"+ selectedSymbol ; break; 
 
       case "1.1$-": FinalValue = commaSaperatedVal+selectedSymbol + "-"; break; 
 
       case "-1.1 $": FinalValue = "-" + commaSaperatedVal +" "+ selectedSymbol ; break; 
 
       case "-$ 1.1": FinalValue = "-" + " "+ selectedSymbol + commaSaperatedVal; break; 
 
       case "1.1 $-": FinalValue = commaSaperatedVal + " " + selectedSymbol + "-"; break; 
 
       case "$ 1.1-": FinalValue = selectedSymbol + " " + commaSaperatedVal + "-"; break; 
 
       case "$ -1.1": FinalValue = selectedSymbol + " " + "-" + commaSaperatedVal; break; 
 
       case "1.1- $": FinalValue = commaSaperatedVal + "-" + " " + selectedSymbol; break; 
 
       case "($ 1.1)": FinalValue = "(" + selectedSymbol + " " + commaSaperatedVal + ")"; break; 
 
       case "(1.1 $)": FinalValue = "(" + commaSaperatedVal +" "+ selectedSymbol + ")"; break; 
 
      } 
 
      return FinalValue 
 
     } 
 
     return FinalValue; 
 
    } 
 
}

Answer 2

Je ne sais pas si j'ai bien compris votre question.

Voulez-vous filtrer par plusieurs champs? Si oui - il suffit de définir plusieurs champs pour filtrer objet

par exemple si votre objet filtre est userFilter et votre déjà une entrée que la valeur fixe au champ mes

<input type="text" name="term" [(ngModel)]="userFilter.mes" class="form-control" id="term" placeholder="Buscar por mes...">

ajouter une autre entrée qui définit la valeur par exemple pour filtrer par Annio:

<input type="text" name="Annio" [(ngModel)]="userFilter.Annio" class="form-control" placeholder="Annio">

Hope this aide