NG-重复过滤器，只在某些属性值的元素迭代 [英] ng-repeat filter to iterate only over elements with certain property value

问题描述

我想通过一个数组来NG-重复，但过滤器的结果，因此只有符合特定属性值的元素将被显示。这是可能的，怎么样？

这里是我想要做的（显然不及格）的例子：

HTML（查看）

 ＆LT; UL＆GT;
  ＆LT;李NG重复=人在人们|过滤器：person.gender =='男'＆GT;＆LT; /李＆GT;
＆LT; / UL＆GT;＆LT; UL＆GT;
  ＆LT;李NG重复=人在人们|过滤器：person.gender =='女'＆GT;＆LT; /李＆GT;
＆LT; / UL＆GT;
 

JS（控制器）

  $ scope.people = [  {名字：约翰，性别男}，  {名：苏，性别女}，  {名：玛丽亚，性别女}，  {名：鲍勃性别男}，]
 

因此​​，第一个列表应该只是打印的男性名字，第二个女性，根据属性值。

这可能使用NG-repeat的过滤器？或者，如果不是有另一种方式？

在此先感谢

解决方案

试试这个。
如果放：真正的过滤器后，再经过滤做的正是在匹配值

\r

\r

函数main（$范围）{\r
    $ scope.people = [\r
\r
  {名字：约翰，性别男}，\r
\r
  {名：苏，性别女}，\r
\r
  {名：玛丽亚，性别女}，\r
\r
  {名：鲍勃性别男}\r
\r
];\r
}

\r

＆LT;脚本SRC =htt​​ps://ajax.googleapis.com/ajax /libs/angularjs/1.2.23/angular.min.js\"></script>\r
＆LT; D​​IV NG-应用＆GT;\r
    ＆LT; D​​IV NG控制器=主＆GT;\r
      ＆LT; UL＆GT;\r
  ＆LT;李NG重复=人在人们|过滤器：{性别：'男'}：真正的＆GT;\r
   {{person.name}}\r
  ＆LT; /李＆GT;\r
＆LT; / UL＆GT;\r
\r
    ＆LT; / DIV＆GT;\r
＆LT; / DIV＆GT;

\r

\r

\r

I want to ng-repeat through an array, but filter the results so that only the elements that match a certain property value will be displayed. Is this possible, and how?

Here's an example of what I'm trying to do (and obviously failing):

HTML (View)

<ul>
  <li ng-repeat="person in people | filter: person.gender == 'male'"></li>
</ul>

<ul>
  <li ng-repeat="person in people | filter: person.gender == 'female'"></li>
</ul>

JS (Controller)

$scope.people = [

  {name: "John", gender: "male"},

  {name: "Sue", gender: "female"},

  {name: "Maria", gender: "female"},

  {name: "Bob", gender: "male"},

]

So the first list should just print the male names, and the second female, based on the property values.

Is this possible using ng-repeat's filter? Or if not is there another way?

Thanks in advance

解决方案

try this. if put :true after filter then filtering do exactly on match value.

function Main($scope) {
    $scope.people = [

  {name: "John", gender: "male"},

  {name: "Sue", gender: "female"},

  {name: "Maria", gender: "female"},

  {name: "Bob", gender: "male"}

];
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app>
    <div ng-controller="Main">
      <ul>
  <li ng-repeat="person in people | filter: { gender: 'male' }:true">
   {{person.name}}
  </li>
</ul>

    </div>
</div>

这篇关于NG-重复过滤器，只在某些属性值的元素迭代的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！