过滤结果不准确

我正在使用AngularJS构建一个工作板应用程序来了解该框架。我得到了应用程序从JSON中提取数据并添加了一些过滤器。尽管过滤器可以正常工作，但它们并不总是为搜索查询显示正确的结果。下面的代码：过滤结果不准确

<h1 class="text-center">Active Jobs</h1> 
    <div class = "row"> 
    <div class="col-md-4 col-md-offset-6"><input type="text" class="form-control" ng-model = "search" placeholder="Search Jobs"></div> 
    <div class = "col-md-6 col-md-offset-6"> 
    <label>Sort by: 
      <select ng-model="jobSearch"> 
       <option value="location" selected>Location</option> 
       <option value="salary">Salary</option> 
       <option value="role">Role</option>     
      </select> 
     </label> 
    <label class="formgroup"> 
     <input type="radio" ng-model="order" name ="order" checked> ascending 
    </label> 
    <label class="formgroup"> 
     <input type="radio" ng-model="order" name ="order" value = "reverse"> descending 
    </label>  
    </div> 
</div> 
</div> 
    <div class="row" ng-repeat="job in jobs | filter:search | orderBy: jobSearch:order"> 
    <div class="col-md-6"> 
     <h2><a href = "#/jobs/{{ jobs.indexOf(job) }}">{{ job.designation }}</a></h2> 
     <p>{{ job.location }}</p> 
     <p>{{ job.role }}</p> 
     <p>{{ job.salary | currency }}</p> 
    </div> 
</div> 
</div>

我已经创造就业机会像奥斯汀，旧金山，赫特福德郡等地点。当我开始打字，说，“他”或“她”，除了赫特福德郡上市，其他几个列表也显示出来。仔细检查后，我发现带有这些字母的单词出现在这些列表的说明中。当我使用角色（远程，全职，兼职）搜索时也会发生同样的情况。我如何确保仅在下拉列表中选择的属性上执行查询，而不是整个列表中的属性？

来源

2014-09-24 user3224820

在

<div class="row" ng-repeat="job in jobs | filter:search | orderBy: jobSearch:order">

搜索绑定到你输入的字符串。在过滤器中使用字符串时，将返回数组中包含搜索值的字符串属性的所有对象。

如果你只想搜索的地点，您输入的NG-模式更改为：

<input type="text" class="form-control" ng-model = "search.location" placeholder="Search Jobs">

编辑

它应该更容易在你的控制器使用功能

$scope.search(value) { 
    return value[$scope.jobSearch] == $scope.searchTerm; 
}

在您的html中，您将输入搜索绑定到searchTerm：

<input type="text" class="form-control" ng-model = "searchTerm" placeholder="Search Jobs">

和你的过滤器的搜索功能：

<div class="row" ng-repeat="job in jobs | filter:search() | orderBy: jobSearch:order">

希望能够帮助

来源

2014-09-24 09:47:35

我正在使用一个下拉菜单，我想要使用菜单（薪水，角色）中的其他选项。在这种情况下，有没有办法适应这种解决方案？ – user3224820 2014-09-24 10:57:45

你可以试试ng-model =“search [jobSearch]”而不是ng-model =“search.location”。尽管您必须在jobSearch更改时清空搜索对象。 – 2014-09-24 12:40:13

我编辑我的答案，使用一个适合您的用例的函数。 – 2014-09-24 13:07:29

<div class="row" ng-repeat="job in jobs | filter:{jobSearch: search} | orderBy: jobSearch:order">

检查这一项

来源

2014-09-24 09:46:09

这打破了搜索。没有出现结果。 – user3224820 2014-09-24 10:55:02

此返回没有值，因为这返回作业，其中'工作['jobSearch'] ==搜索'，而不是'工作[jobSearch] ==搜索'。 – 2014-09-24 13:05:50

过滤结果不准确

回答

相关问题