两个对象字段上的AngularJs过滤器

Question

我已经完成了多次过滤，但在此特定情况下遇到问题。我有分页设置的对象列表，但我也希望能够过滤它们以便于使用。一个例子对象可能看起来像：

{ 
    baseline:0.75 
    clonedFrom:Object 
    description:"Just a simple description.." 
    includeable:false 
    key:"bc889881-7979-4e04-b586-d53faab26b6b" 
    name:"Just a simple question?" 
    type:"BayesianModel" 
    version:1483477351992 
    versionComment:null 
    versionLabel:"0.11" 
} 

在大多数情况下，物体的样子是任意的，我只是包括它易于回答的。我试图同时过滤对象的name和description。例如，如果用户知道关键词，他们可以缩小结果。

我有input的过滤器和下面所示的<ul>内的结果：

<ul class="list-group"> 
    <li class="list-group-item"> 
    <div class="form-group has-feedback"> 
     <input type="text" 
      ng-model="vm.resultFilter" 
      ng-change="vm.updateFilter()" 
      class="form-control filterInput" 
      placeholder="Filter Results" /> 
     <span ng-if="vm.resultFilter" 
      ng-click="vm.resultFilter = ''; vm.updateFilter();" 
      class="fa fa-times fa-lg form-control-feedback"> 
     </span> 
    </div> 
    </li> 
    <li class="list-group-item link-row model-list" 
     ng-repeat="result in vm.filteredResults 
      | startFrom : ((vm.currentPage - 1) * vm.itemsPerPage) 
      | limitTo: vm.itemsPerPage" 
     ng-if="result.name != vm.model.name" 
     ng-click="vm.selected = result;" 
     ng-class="{selected: result === vm.selected}" 
     ng-init="displayNumber = vm.incrementDisplayIndex();"> 
    <h4 class="list-group-item-heading">{{result.description}} - {{result.name !== vm.model.name}}</h4> 
    <p class="list-group-item-text"> 
     {{result.name}} 
    </p> 
    </li> 
</ul> 

所以过滤器的名称是vm.resultFilter和被称为每次过滤器更新时间是cooresponding方法updateFilter()（这是分页的东西所必需的）。

function updateFilter() { 
    vm.filteredResults = $filter('filter')(vm.results, { 
    'name': vm.resultFilter, 
    'description': vm.resultFilter 
    }); 
    vm.totalItems = vm.filteredResults.length; 
    vm.noOfPages = Math.ceil(vm.filteredResults.length/vm.itemsPerPage); 
} 

我只是具有越来越过滤工作100％的烦恼。有时它看起来只是在描述字段上进行过滤，但有时我会搜索只有一个结果的描述字段中的一个字，并且它将过滤而没有结果（这将是错误的）。任何提示赞赏。

Answer 1

由于您的HTML内没有使用filter，我建议您使用Array原型中的filter属性。

function updateFilter() { 
    vm.filteredResults = vm.results.filter(function(item){ 
    return (item.name==vm.resultFilter || item.description==vm.resultFilter) 
    } 

    vm.totalItems = vm.filteredResults.length; 
    vm.noOfPages = Math.ceil(vm.filteredResults.length/vm.itemsPerPage); 
} 

如果您需要确定一个字符串是否包含指定字符串的字符。您可能需要使用includes，而不是==

vm.filteredResults = vm.results.filter(function(item){ 
    return (item.name.includes(vm.resultFilter) || item.description.includes(vm.resultFilter)) 
}