Функциональность фильтра поиска Angular4 для всей таблицы

Здесь я реализовал небольшой фильтр поиска в таблице. Но мое требование заключается в том, что он должен искать всю таблицу не на странице?

поиск

<label> Search FRom Table:</label> <input (change)="someval($event.target.value)">          


someval(value){
   let data=JSON.stringify(value);
   console.log(data.length);
   this.auction.find(e=>e.uniqueid=data);
   this.GetDashBoardData();
}
GetDashBoardData(){
    var somedata= this.globalService.getBasicInfoData();
    this.auctionRequest = {    
      "loginId": this.userdata.LoginID
    }; 
    return this.httpService.dashbordTheUser2(this.auctionRequest).subscribe((response) => {
      this.auction = response.data;
}

Здесь я немного меняю, например, когда я ввожу текст в текстовое поле, он отображается в массиве This.auction, но я не знаю, как я могу связать это в таблице.

<tr *ngFor="let value of pagedItems">
                     <td>{{value.name}}</td>

person Community    schedule 12.06.2018    source источник
comment
Что выведется в вашей консоли, если вы поместите эту строку в свой фильтр перед возвратом? console.log('result: ', customers.filter(customer => customer.email.toLowerCase().indexOf(args[0].toLowerCase()) !== -1));   -  person Lynx 242    schedule 12.06.2018
comment
@DiabolicWords отображает 1-ю запись   -  person    schedule 12.06.2018
comment
Ответ Кришны Ратор выглядит многообещающе. Ты это пробовал?   -  person Lynx 242    schedule 12.06.2018
comment
нет, это фильтрация shiwing согласно oaging   -  person    schedule 12.06.2018
comment
Извините, но у меня нет дальнейших идей.   -  person Lynx 242    schedule 12.06.2018
comment
@DiabolicWords, не могли бы вы перепроверить мой код, он был только что обновлен   -  person    schedule 12.06.2018


Ответы (1)


Вы можете попробовать это решение

Я создал демонстрацию на stackblitz

Поисковая труба

transform(value: any, args?: any): any {
    if (!args) {
      return value;
    }
    return value.filter((val) => {
      let rVal = (val.id.toLocaleLowerCase().includes(args)) || (val.email.toLocaleLowerCase().includes(args));
      return rVal;
    })

}

HTML-код

<tr *ngFor="let customer of users | customerEmailFilter:email;let i = index">
    <th scope="row">{{i+1}}</th>
    <td>{{customer.id}}</td>
    <td>{{customer.email}}</td>
</tr>

код файла ts

users=[{
    id:'123',
    email:'[email protected]'
  },{
    id:'1234',
    email:'[email protected]'
  },{
    id:'12345',
    email:'[email protected]'
  },{
    id:'123456',
    email:'[email protected]'
}]
person Krishna Rathore    schedule 12.06.2018