Javascript 数组子元素上的AngularJS筛选器列表

我试图在列表上创建一个简单的AngularJS过滤器。但是，我要筛选的元素是数组中的子元素

（）

对象：

elements = [{
    'claim': [{value:'foo'}],
    class: 'class1',
    subject: 'name1'
}, {
    'claim':  [{value:'bar'}],
    class: 'class1',
    subject: 'name2'
}, {
    'claim':  [{value:'baz'}],
    class: 'class1',
    subject: 'name2'
}, {
    'claim':  [{value:'quux'}],
    class: 'class1',
    subject: 'name3'
}];

HTML:

---

有趣的问题。特别是因为嵌套数组值用于排序而不是过滤。我和你的JSFiddle玩了一场，但没能让任何东西开箱即用。通过编写自己的过滤器，您可以很容易地解决这个问题

我要展示你是如何做到这一点的。我对您的代码所做的唯一更改如下所示：

JavaScript

myApp.filter('byFirstClaimValue', function () {
    return function (items, filterText) {
        if(!filterText)
            return items;

        var out = [];
        for (var i = 0; i < items.length; i++) {
            if (items[i].claim[0].value.toLowerCase().indexOf(filterText.toLowerCase()) > -1) {
                out.push(items[i]);
            }
        }
        return out;
    }
});

myApp.filter（'byFirstClaimValue'，函数（）{
返回函数（项目、过滤器文本）{
如果（！filterText）
退货项目；
var out=[]；
对于（变量i=0；i-1）{
推出（项目[i]）；
}
}
返回；
}
});

HTML

<tr class="claimrow" data-ng-repeat="c in elements | byFirstClaimValue:srcBoxFilter | orderBy: 'claim[0].value'">

由于阵列的引入，可能的重复项有所不同。我尝试过filter:{claim:[{value:srcBoxFilter}]}但这似乎不起作用（尽管错误消失了），我知道创建自己的过滤器是一种选择，但我认为应该有一个“开箱即用”的解决方案。或者至少是一个内联函数解决方案是的，如果顺序是有效的，那么看起来你应该做的是+我想问你一个问题：）

myApp.filter('byFirstClaimValue', function () {
    return function (items, filterText) {
        if(!filterText)
            return items;

        var out = [];
        for (var i = 0; i < items.length; i++) {
            if (items[i].claim[0].value.toLowerCase().indexOf(filterText.toLowerCase()) > -1) {
                out.push(items[i]);
            }
        }
        return out;
    }
});

<tr class="claimrow" data-ng-repeat="c in elements | byFirstClaimValue:srcBoxFilter | orderBy: 'claim[0].value'">