子阵列上的角度ng重复滤波器

时间:2014-07-24 18:25:44

标签: javascript angularjs angularjs-directive angularjs-ng-repeat mean-stack

使用Angular,我试图在FactorName上使用ng-repeat进行过滤,给定以下模式 使用过滤 < ... ng-model =" query.Factors.FactorName" ...>不起作用(不足为奇)。 我还没有看到任何试图以这种方式过滤的文献。

Angular是否支持基于子数组元素属性的过滤?

[
   {
      "Name":"1",
      "Factors":[
         {
            "FactorName":"FactorOne",
            "Type":"SomeType"
         },
         {
            "FactorName":"FactorTwo",
            "Type":"SomeType"
         }
      ]
   },
   {
      "Name":"2",
      "Factors":[
         {
            "FactorName":"FactorThree",
            "Type":"SomeType"
         },
         {
            "FactorName":"FactorFour",
            "Type":"SomeType"
         }
      ]
   }
]

2 个答案:

答案 0 :(得分:1)

还有另一个地方,您可以使用自定义过滤器在双重绑定中迭代数组,与ng-repeat一起工作。

Working Demo

<强> HTML

<ul ng-repeat="x in factorData">
  <li>
    {{ x.Factors | factorFilter }}
  </li>
</ul>

<强> JS

app.filter('factorFilter', function() {
    return function(items) {
        var results = [];
        if (items) {
            for (var i = 0; i < items.length; i++) {
                results = items[i]['FactorName'];
            }
            return results;
        } else {
          return 'Doh!';
        }
   }
})    

答案 1 :(得分:0)

我想出了对数组因子的任何元素进行过滤,但无法想出如何只选择数组的一个字段。也许它只适合你:

<input ng-model="filtervalue.Factors"/><br/><br/>
Filtered:
<p><span ng-repeat="d in data | filter:filtervalue:false">{{d}}</span></p>

JS上的初始化:

$scope.filtervalue = {};

jsfiddle上的示例:

http://jsfiddle.net/jordiburgos/QFUu6/