带有嵌套ng-repeat的AngularJS过滤器数组

问题描述 投票:0回答:1

我有这个嵌套列表,我想根据searchKey输入进行过滤,其中包含stringsarray(kendo多选择器)。过滤器字段应为{{child.name}}字段,并将过滤结果应用于第一个ng-repeat colection.items

中的主要元素

我不知道如何根据kendo输入中的关键字数组过滤此值数组。我尝试过类似的情况,但没有成功。 AngularJS filter based on array of strings?。任何帮助将不胜感激。

<div ng-app="ngApp">
<div ng-controller="ngAppController">
    <div id="filtering">                    
        <input id="searchKey" type="text" placeholder="Search keys" ng-model="listSearch" />
    </div>
    <ul id="allItems" infinite-scroll="colection.nextPage()"
        infinite-scroll-distance="0"
        infinite-scroll-disabled='colection.busy || colection.finished'>
        <li ng-repeat="item in colection.items | filter:listSearch"
            ng-show="colection.items.length > 0"
            class="block-grid-item">
            <a href="javascript: void(0);" data-detail="{{ item.Id }}">
                <div class="imageWrap" style="background-image:url({{ item.thumb }});">

                    <div class="filetypeContainer"><span>{{ item.fileFormatIdentifier }}</span></div>
                    <ul>
                        <li ng-repeat="child in item.categories" style="list-style: none; display: inline-block;">
                            <code style="font-size:11px;">{{ child.name }} </code>
                        </li>
                    </ul>
                    <div class="infoContainer">i</div>
                </div>
            </a>
        </li>
    </ul>

javascript arrays angularjs filter
1个回答
0
投票

似乎您在那里很多。正如answer you found所指出的,您可以制作一个过滤器(为清楚起见,将其称为multiSelectFilter

<div id="filtering">                    
        <input id="searchKey" type="text" placeholder="Search keys" k-ng-model="listSearch" /><!-- note custom kendo model binding -->
    </div>
<li ng-repeat="item in colection.items | multiSelectFilter:listSearch"
            ng-show="colection.items.length > 0"
            class="block-grid-item">
angular.module('myApp').filter('multiSelectFilter', function() {
    return function(items, listSearch) {
        return items.filter(function(item) {
            for (var s in listSearch) {
                if (item.indexOf(s) != -1) {
                    return true;
                }
            }
            return false;

        });
    };
});

希望有帮助。

© www.soinside.com 2019 - 2024. All rights reserved.