javascript - angularjs 过滤器 |不过滤所有对象属性

标签 javascript angularjs object filter angularjs-ng-repeat

一个简单的 `angularjs' 过滤器实现如下:

<!DOCTYPE html>
<html ng-app="app">
<head>
    <title>angularjs</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script>
    <script src="js/app.js"></script>
</head>
<body>
    <input type="text" name="query" value="" placeholder="query" ng-model="q">
    <ol ng-controller="ItemsController">
        <li ng-repeat="item in items | filter: q">
            {{item.name}}
        </li>
    </ol>
</body>
<script type="text/javascript">
    'use strict';
    (function() {
      var app = angular.module('app', []);

      app.value('items', [
        {name: 'Item 3', position: 3, color: 'red', price: 2.75},
        {name: 'Item 1', position: 1, color: 'red', price: 0.92},
        {name: 'Item 4', position: 4, color: 'blue', price: 3.09},
        {name: 'Item 2', position: 2, color: 'red', price: 1.95}
      ]);

      app.controller('ItemsController', function($scope, items) {
        $scope.items = items;
      });
    })();
</script>
</html>

当我在输入框中搜索时,它会搜索 items 数组中对象的所有属性,包括 position & price 即使只有 name 属性被重复。 IE。 如果我搜索 2,它会返回 item 1item 2item 3。但我只想要第 2 项。如何将搜索锁定到对象的可见属性?

最佳答案

将过滤器更改为:

<li ng-repeat="item in items | filter: {name: q}">
    {{item.name}}
</li>

这是一个 plnkr

关于javascript - angularjs 过滤器 |不过滤所有对象属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32502812/

相关文章:

javascript - Ajax - 检查 Url 是否存在的函数

javascript - 将一个输入的值放入 AngularJS 中的另一个输入表单中

python - 转换日期对象中的字符串(包含其他字符串) - Python

Java 对象数组 Foreach 方法访问

java - 如何从 SQLite 获取一行到具有自定义对象的模型?

javascript - React Native BackHandler 不跟随状态更新

javascript - 悬停时更改底部边框的颜色

javascript - CSS 过渡不向后工作

javascript - 如何使用 Angular 在单击时动态地将类添加到其他元素

angularjs - ng-repeat中的ng-transclude正在失去对$ transclude函数的访问权限