angularjs - วิธีใช้ตัวกรองการค้นหาบนรายการใน angular2?

ฉันต้องการที่จะใช้งานตัวกรองการค้นหาบนรายการข้อมูลที่เก็บอยู่ในอาเรย์ และฉันต้องการที่จะใช้ตัวกรองการค้นหาเหมือนกับการค้นหาในตารางข้อมูล ตามที่แสดงในภาพด้านล่าง แต่ในฟิลด์เหล่านั้น (ชื่อ, ที่อยู่ ฯลฯ) ไม่ได้มีการกำหนดแน่นอน

ฉันจะทำให้สิ่งนี้สำเร็จได้อย่างไร?

คำตอบ #1

สาธิต

ถ้าคุณต้องการกรองตามฟิลด์อื่น ๆ เพียงเพิ่มพวกมันในท่อ:

import { Pipe,PipeTransform} from '@angular/core';

@Pipe({
    name: 'searchFilter'
})
export class SearchFilter implements PipeTransform {
    transform(items: any[], criteria: any): any {

        return items.filter(item =>{
           for (let key in item ) {
             if((""+item[key]).toLocaleLowerCase().includes(criteria.toLocaleLowerCase())){
                return true;
             }
           }
           return false;
        });
    }
}

    @Component({
      selector: 'sites-component',
      template: `
        <input #search  (keyup)="0">
        <ul>
          <li *ngFor="let site of (sites | searchFilter: search.value )">(...)</li>
        </ul>
      `
    })
    export class SitesComponent{
       sites : Array;
    }

อย่าลืมประกาศ pipe ในโมดูลของคุณ