AngularDart：过滤器链接：过滤器的顺序重要吗？

Question

我想了解如何通过 ng-repeat 指令在 AngularDart 中执行链式过滤器/格式化程序。

谁能以简洁明了的方式解释它的工作原理？

参考教程没有提供足够的细节来完全掌握 AngularDart 链式过滤器的执行工作原理。以下是我通过查看文档和查看 AngularDart 源代码部分的理解。

参考链接： http://runnable.com/UvL5t92j1pVCAAAQ/angular-dart-tutorial-chapter-05 github原帖：https://github.com/angular/angular.dart.tutorial/issues/74

** 用于评估 ng-repeat 中的过滤器的假定执行链**

格式化程序/过滤器可以访问中继器内的列表，例如 ng-repeat

recipeList 是通过 ng-repeat 的作用域提供给 cf

cf=categoryfilter(list, map) -->分类列表

fltr=filter (list, nameFilterString)--> filteredList, name

ordBy=orderBy(list, name)--> orderdList

1. 首先获取用户选择的类别，将列表传递给下一个过滤器
2. 根据所选类别过滤输入的文本
3. 按照名称默认升序对上述2中过滤的列表进行排序
4. 为列表中的每个项目创建一个 html 跨度

Html View（从右到左：1.、2.、3.、4.如下所示）：

) >

我想知道 angularDart 中继器 (ng-repeat) 中的列表 (recipeList) 如何将列表传递给每个连续的链式过滤器，并确认过滤器的顺序是否重要（我相信它们确实如此）。我上面的理解正确吗？

< li class="pointer"
          ng-repeat="recipe in ctrl.recipes | orderBy:'name' | filter:{name:ctrl.nameFilterString} | categoryfilter:ctrl.categoryFilterMap" >
.... repeated dom elements omitted here for clarity
< /li >    

Answer 1

表达式中的格式化程序按顺序排列

1. 订购方式
2. 过滤器
3. 类别过滤器

最初它们是按照这个顺序调用的

orderby 被通过

[Appetizers, Salads, Soups, Main Dishes, Side Dishes, Desserts, Desserts]

然后返回

[Desserts, Appetizers, Salads, Desserts, Side Dishes, Soups, Main Dishes]

未更改地传递给 categoryfilter（因为尚未设置过滤器值）
categoryfilter 再次返回未更改的集合

选择类别后，仅调用类别格式化程序。
输入名称（过滤器表达式的值）后，将调用过滤器和分类过滤器格式化程序。 更改名称过滤器值有时只会触发过滤器，但有时也会触发 categoryfilter 格式化程序。

调用格式化程序的顺序始终与它们在标记中出现的顺序相同，但并非每次都调用每个过滤器。 Angular 识别依赖关系，并且仅在依赖值发生更改时才调用过滤器。

编辑

这个表达式的结果被传递给ng-repeat

ctrl.recipes | orderBy:'名称' |过滤器：{名称：ctrl.nameFilterString} | categoryfilter:ctrl.categoryFilterMap

ctrl.receipes 被传递给所有过滤器，最后一个过滤器的结果被传递给ng-repeat

EDIT2

我只是复制KK报告的调查结果：

我在调试器中确认了该行为。看来你的答案应该有轻微的更正。 orderBy 返回其更改后的列表并将其传递给filter，即使在过滤器输入文本框中没有输入任何内容。然后filter 为输入文本框字段值处理null。然后filter 将列表原封不动地传递给categoryfilter，然后categoryfilter 将列表传递给ng-repeat。