javascript - Angular `ng-repeat` - 如何只过滤两个属性?

标签 javascript angularjs angularjs-ng-repeat

目前,我有一个搜索框和一个重复列表。我的重复列表使用具有许多属性的对象。

JSON

$scope.userlist = [{
  firstName: "Jack",
  lastName: "Smith",
  description: "This is a description"
}, {
  firstName: "Luke",
  lastName: "McDonald",
  description: "My name is Luke, and my friend is Jack"
}]

这是我的重复列表:

<md-list-item ng-repeat="user in userList | filter: searchInput as allResults">
  <p>{{user.firstName}} {{user.lastName}}</p>
</md-list-item>

我的搜索框模型是 searchInput,对象作为 $scope.userList 保存到作用域中。

如果我搜索 jack,两个结果都会显示,因为两个对象都包含此搜索词。

如何限制我的过滤器只在 firstNamelastName 属性中查找?

最佳答案

在你的 Controller 中使用它

$scope.searchFilter = function (user) {
    var keyword = new RegExp($scope.searchInput, 'i');
    return !$scope.searchInput || keyword.test(user.firstName) || keyword.test(user.lastName);
}

您的 HTML 将是:

<md-list-item ng-repeat="user in userList | filter: searchFilter"> 
<p>{{user.firstName}} {{user.lastName}}</p>
</md-list-item>

关于javascript - Angular `ng-repeat` - 如何只过滤两个属性?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34917310/

相关文章:

javascript - 输入文本的 ng-repeat 未填充指令中的 ng-model

javascript - 使用 Canvas 连接具有相同类的元素

javascript - 可以通过浏览器上传文件到github页面吗?

angularjs - 创建包含组件的 Angular 表单的最佳方法是什么?

angularjs - 在 angularjs 中进行单元测试时如何模拟 $location

javascript - 如何在绘制之前获取 D3.js 元素的尺寸?

angularjs - 使用索引位置验证字段

javascript - Vuejs 和 Laravel 发送数据不起作用

javascript - 等待所有 AJAX 调用而不是显示对话框

angularjs - 使用 ng-repeat-start 重复多个 <td> 元素