angular - 在angular4中的2个字母后搜索管道

Question

我有 seacrh 管道，它工作正常，问题是它在我输入完整单词后进行搜索，我想在输入两个字母后进行 seacrh这是代码

<input type="text" class="form-control"   [value]="searchRole"/>
<li *ngFor="let user of roleUserData | SearchRolePipe: 'name':searchRole ;let  i= index" >{{user.name}}</li>

export class SearchRolePipe implements PipeTransform {


  transform(items: any[], field: string, value: string): any[] {

    if (value === '') {
      return items
    }
     if (!items) {

       return [];
     } else {

      return items.filter(it => it[field] == value);
}
}

它工作正常，我的要求是它应该在用户输入 2 个字母后搜索

例子如果数组是这样的

[
{'name': 'abc'}, 
{'name': 'abcde'},
{'name': 'bce'}

]这里的 searchRole 是空的公共(public)变量如果我要搜索 abc 那么它只会返回结果 [{name: abc}]

但是我想如果我输入'ab'然后它应该返回

[
 {'name': 'abc'}, 
    {'name': 'abcde'}]

请任何人告诉我如何解决它或任何其他好的方法

Answer 1

这会做你想做的事

// imports in top level  
    import { of, pipe } from 'rxjs';
    import { map, filter } from 'rxjs/operators';
// imports in top level 

const namesArray = of('omar', 'ali', 'tota', 'lelo', 'pedo')
.pipe(filter((n: any) => n.indexOf('o') >= 0)); // get names containing letter "o"
namesArray.subscribe(x => console.log('filter,map ', x));