Question

我正在使用textarea搜索表，所有这些都在带有bootstrap的angular2应用程序中。

我的代码在一列中搜索，现在我希望在两列中查找搜索词，用户将看到所有匹配的表行突出显示。

HTML：

<input class="form-control" id="search" [(ngModel)]="searchString" type="text" placeholder="Search by Book ID.." style="float:right;"
  value="">

<tr *ngFor="let books of bookDetails |jobsearch:{ bookId: searchString} : false | paginate: { itemsPerPage: 50, currentPage: p };">

我想要搜索的另一列是＆＃39; bookName＆＃39;。

Answer 1

自定义管道示例：

@Pipe({
    name: 'booksearch'
})
export class BookSearchPipe implements PipeTransform {
    transform(items: Array<any>, filter: {[key: string]: any }): Array<any> {
        return items.filter(item => {
            let noMatch = Object.keys(filter)
            .find(key => item[key] !== filter[key]);

            return !noMatch;
        });
    }
}

用法：

<tr *ngFor="let books of bookDetails |booksearch:{ bookId: searchString, bookname: searchString }”>

在多个列中搜索angular2

1 个答案: