正好在对象键上的角度过滤器 [英] Angular filter exactly on object key

查看:25
本文介绍了正好在对象键上的角度过滤器的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个像这样的小角度应用:

html

<div ng-controller="Ctrl"><div ng-repeat="user in users | filter:1"><span>{{ user.username }}, {{ user.id }}</span>

app.js

function Ctrl($scope) {$scope.users = [{"id":1,"username":"simon",},{"id":8,"username":"betty",},{"id":14,"username":"archie",},{"id":3,"username":"jumbo1"},]}

输出

西蒙,1阿奇, 14巨型 1, 3

我想要做的是过滤 exact 匹配的过滤器参数,并仅过滤 id 字段.

基本上,我希望输出是:

输出

西蒙,1

我使用的是 Angular 1.2.

解决方案

在 Angular 1.1.3 或更新版本中,您可以使用以下内容:

{'id': 1} 表示只与字段 id 进行比较.这让你:

西蒙,1阿奇, 14

:true 表示完全匹配"导致:

西蒙,1

这是有效的:http://jsfiddle.net/AM95H/

要根据值列表进行过滤,如果您在范围变量中有列表,我会在您的 JS 文件中添加一个自定义过滤器:

$scope.filterValues = [1,8];$scope.myFilter = 函数(值){返回 ($scope.filterValues.indexOf(value.id) !== -1);};

像这样使用:

要根据参数列表进行过滤,我们将创建自己的过滤器.在这种情况下,我们将使用所有要测试的输入值调用一次,而不是每个值调用一次.

因此,我们将收到的第一个参数是输入值数组(在您的情况下为用户),第二个参数将是我们传入的参数 ([1,8]).然后,我们将创建一个输出数组并添加(推送)输入流中与 filterValues 之一匹配的任何项目.并返回输出数组.

myApp.filter('myFilter', function () {返回函数(输入,过滤器值){var 输出 = [];angular.forEach(输入,函数(输入){如果(filterValues.indexOf(input.id)!== -1)输出推(输入);});返回输出;};});

像这样使用它:

这是一个例子:http://jsfiddle.net/AM95H/2/

I have a small angular app like so:

html

<body ng-app>
  <div ng-controller="Ctrl">
    <div ng-repeat="user in users | filter:1">
      <span>{{ user.username }}, {{ user.id }}</span>
    </div>
  </div>
</body>

app.js

function Ctrl($scope) {
  $scope.users = [
    {"id":1,"username":"simon",},
    {"id":8,"username":"betty",},
    {"id":14,"username":"archie",},
    {"id":3,"username":"jumbo1"},
  ]
}

output

simon, 1
archie, 14
jumbo1, 3

What I want to do is filter an exact match for filter argument AND filter on the id field ONLY.

Basically, I want the output to be:

output

simon, 1

I am using Angular 1.2.

解决方案

In Angular 1.1.3 or newer you can use the following:

<div ng-repeat="user in users | filter:{'id':  1}:true">

{'id': 1} says to only compare with the field id. That gets you:

simon, 1
archie, 14

:true says "exact match" resulting in:

simon, 1

Here's that working: http://jsfiddle.net/AM95H/

To filter against a list of values, if you have the list in a scope variable, I'd add a custom filter to your JS file:

$scope.filterValues = [1,8];
$scope.myFilter = function(value) {
   return ($scope.filterValues.indexOf(value.id) !== -1);
};

Used like this:

<div ng-repeat="user in users |  filter: myFilter">

To filter against a parameter list we'll create our own filter. In this case we'll get called once with all the input values to test rather than once per value.

So the first parameter we'll receive is the array of input values (users in your case) and the second parameter will be the parameter we pass in ([1,8]). We'll then create an output array and add (push) any items in the input stream that match one of the filterValues. And return the output array.

myApp.filter('myFilter', function () {  
   return function(inputs,filterValues) {
      var output = [];
      angular.forEach(inputs, function (input) {
        if (filterValues.indexOf(input.id) !== -1)
            output.push(input);
       });
       return output;
   };
});

And use it like this:

<div ng-repeat="user in users |  myFilter:[1,8]">

Here's an example of this: http://jsfiddle.net/AM95H/2/

这篇关于正好在对象键上的角度过滤器的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
其他开发最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆