javascript - Angular JS : why {{objA. objB.date | date :'dd.MM.yyyy HH:mm' }} 需要多少时间？

Question

在 Chrome 开发工具的 AngularJS 选项卡中(我使用的是 AngularJS Batarang(稳定版))。我有以下几行，描述了哪些 watch 表达式的求值时间最长(如果一个表达式被多次调用，则求值时间被加上)

{{objA.objB.date | date:'dd.MM.yyyy HH:mm'}} | 20.1% | 1009ms
{{objA.objB.date | date:'dd.MM.yyyy, HH:mm'}} | 22.8% | 1148ms

问题是为什么这样的评估要花这么多时间？

Answer 1

我认为这对 Angular 来说是“正常的”，因为一旦发生变化，Angular 会在每个 $digest 周期运行每个过滤器(包括日期过滤器)两次。这会影响性能。第一次运行是从 $$watchers 检测任何变化，第二次运行是为了查看是否有进一步的变化需要更新值。

如果您可以更改 DOM 过滤器:

{{objA.objB.date | date:'dd.MM.yyyy HH:mm'}}

要使用 $filter 提供程序，您可以使用它在 Controller 中运行过滤器，然后再将它们解析到 DOM 中，您可以在将数据发送到 View 之前对数据进行预处理，这避免了解析 DOM 和理解内联过滤器的步骤语法:

$scope.theDate = $filter('date')(objA.objB.date, 'dd.MM.yyyy HH:mm');