2017-01-23 74 views
0

我试图构建一个搜索字段来过滤我的表格行,但是由于我在管道中的“值”未定义,所以我遇到了一些问题。使用管道筛选HTTP JSON内容

以下是我有:

管:

@Pipe({ 
    name: 'filter', 
    pure: false 
}) 
export class SearchPipe implements PipeTransform { 
    transform(value, searchinput) { 
     if (!searchinput[0]) { 
      return value; 
     } else if (value) { 
      return value.filter(item => { 
       for (let key in item) { 
        if ((typeof item[key] === 'string' || item[key] instanceof String) && 
         (item[key].indexof(searchinput[0]) !== -1)) { 
         return true; 
        } 
       } 
      }); 
     } 
    } 

组件:

constructor(private _serverService: ServerService, private _router: Router) { } 

    errorMessage: string; 
    public servers: Server[]; 
    isLoading = true; 

    selectedServer: Server; 

    ngOnInit() { 
      this.getServers('qa'); 
    } 

    reloadServers(env) { 
     this.servers = null; 

     this.getServers(env); 
    } 

    getServers(env?) { 
     this._serverService.getServers(env) 
      .subscribe(
      value => { 
       this.servers = value; 
       this.isLoading = false; 
      }, 
      error => this.errorMessage = <any>error); 
    } 

所有的数据是否正确填写我的模板,是问题,当我尝试搜索。调试后我发现我的管道中value参数的内容是未定义的。

这里是模板:

<input id="searchinput" class="form-control" type="text" placeholder="Search..." [(ngModel)]="searchinput" /> 

<div id="searchlist" class="list-group"> 
    <table class="table table-bordered table-hover "> 
     <thead> 
      <tr> 
       <th>Hostname</th> 
      </tr> 
     </thead> 
     <tbody> 
       <tr *ngFor="#server of servers | filter: searchinput"> 
        <td>{{server.MachineNameAlias}}</td> 
       </tr> 
      </tbody> 
    </table> 
</div> 

,这里是错误:

EXCEPTION: TypeError: item[key].indexof is not a function in [servers | filter: searchinput in [email protected]:40] 

回答

0

功能是indexOf,不indexof。我没有看到其他的东西,但那是导致你的错误列在底部的原因。

+0

我不能相信我错过了。谢谢!它正在工作。 –

+0

由于某些原因,我只能搜索数字,任何想法为什么? –