使用AngularJS过滤多个定义列表中的多个数组

Question

我想过滤包含 4 个部分的手风琴中的数据。我的代码示例如下（我已经清除了 acordeon 代码和代码中的一些不同部分）

<input type="text" ng-model="searchText" placeholder="Filter">
<dl>
    <dt ng-repeat-start="mainCategory in mainCategories  | filter:searchText" >
        {{mainCategory.Name}}
    </dt>
    <dd ng-repeat-end="">
        <dl>
            <dt ng-repeat-start="subCategory in subCategories[mainCategory.ID] | filter:searchText" >
                {{subCategory.Name}}
            </dt>

            <dd ng-repeat-end="">
                <dl>
                    <dt ng-repeat-start="lesson in subCategoryLessons[subCategory.ID]  | filter:searchText" >
                        {{lesson.Name}}
                    </dt>                
                    <dd ng-repeat-end="">                        
                        <dl>

                            <dt ng-repeat-start="subLesson in subLessons[lesson.ID]  | filter:searchText">
                                {{subLesson.Header}}
                            </dt>

                            <dd ng-repeat-end="">
                                {{subLesson.Content}}
                            </dd>
                        </dl>
                    </dd>
                </dl>
            </dd>
        </dl> 
    </dd>
</dl>

SubCategory、Lesson 和 SubLesson 数据来自另一个服务，它们保存在不同的数组中。

我想过滤此视图中的数据，包括所有数据。但是，如果我在 subLesson 部分（最低类别）中写一些单词，我必须查看父部分（html 元素）才能通过打开 acordeon 来获取 sublesson 数据。

我可以创建这样的过滤器吗？所有数据都来自 JSON 格式的 Web 服务。我必须考虑 ajax 延迟。

Answer 1

AFAIK，filter 管道将搜索对象的所有属性，深度无限。

因此，您可以在第一个 ng-repeat 中将过滤器应用于第一个集合 mainCategories，当且仅当您的所有 subCategories 包含在您的 mainCategories 对象中，等等。

例如，您的数据将如下所示：

mainCategories = [{
   subCategories : [{
       lessons : [{
           subLessons : [{
               ...
           }]
           ...
       }]
       ...
   }]
   ...
}]

你会像这样使用它：

<dt ng-repeat-start="mainCategory in mainCategories  | filter:searchText" >
        {{mainCategory.Name}}
    </dt>
    <dd ng-repeat-end="">
        <dl>
            <dt ng-repeat-start="subCategory in mainCategory.subCategories">