angularjs中的双重过滤

Question

我正在过滤链上，遇到解决方案的麻烦。 首先，我使用search.input模型进行过滤，这很简单而且有效。 我做了一个下拉菜单来进一步过滤结果。 例如。 我输入“ US”，它将在address属性中显示所有使用US的用户。 然后，我选择“专业级别”下拉列表以进一步过滤它，例如仅筛选具有高级技能水平的人员。 有人可以建议吗？

要过滤的数据是这样的。

address: "Los Angeles, US"
avatar: "url"
bestAt: "NodeJS"
firstName: "Dan"
interest: "ExpressJS"
lastName: "Green"
skillLevel: "advanced"
yearExperience: 1
zipCode: "11870"


<div class="dropdown dropdownunit">
  <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">Professional Level
   <span class="caret"></span>
 </button>
  <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
    <li><a href="#">Advanced</a></li>
    <li><a href="#">Intermediate</a></li>
    <li><a href="#">Novice</a></li>
  </ul>
</div>


<div class="col-md-3" ng-repeat="user in search.users | filter:search.input">
  <div class="userinfo">
    <div class="userphotobox">
      <img class="userphoto" src="{{ user.avatar }}">
    </div>
    <p class="userinfobox">Name: {{user.firstName}} {{user.lastName}}</p>
    <p class="userinfobox">Location: {{user.address}}</p>
    <p class="userinfobox">Zip: {{user.zipCode}}</p>
    <p class="userinfobox">Skill Level: {{user.skillLevel}}</p>
    <p class="userinfobox">Experience: {{user.yearExperience}} years</p>
    <p class="userinfobox">bestAt: {{user.bestAt}}</p>
    <p class="userinfobox">Interest: {{user.interest}}</p>
  </div>
</div>

Answer 1

假设search.input像这样： <input ng-model="search.input">

专业级别应转到带有选择标签的下拉列表。 IE浏览器：

<label>Professional Level</label>
<select ng-model="search.level">
  <option value="">Professional Level </option>
  <option value="Advanced">Advanced</option>
  <option value="Intermediate">Intermediate</option>
  <option value="Novice">Novice</option>
</select>

ngRepeat指令应类似于： ng-repeat="user in search.users | filter:search"

http://plnkr.co/edit/h8YjA4QTAMiLJqYoesmp?p=preview