0

我有两个使用相同控制器的单独页面。
我正在使用 ui 路由器状态在页面之间进行更改。
它们包含以下指令,这些指令按顺序将 templateUrl 用于模板:
Page A
directive_1
directive_2

页面 B
指令
_1指令_3 指令_4
指令
_2

每个指令都有一个数组 $scope.array,它以两种方式绑定到其父作用域 $scope.array,并且每个指令都将其指令编号添加到该数组。

每个指令还控制台记录“此处:”+指令编号。

我已经设置了一个监视函数来监视通用控制器上的 $scope.array 并在内部发生任何变化时打印出 $scope.array

现在,当我导航到页面 A 时,我在控制台中看到
Here: 1
[1]
Here: 2
[1,2]

当我离开然后翻页到页面 A 时,我在控制台中看到
Here: 1
Here: 2
[1,2]

所以手表功能只触发一次。

然后奇怪的事情发生了,当我到页面 B 时,我在控制台中看到
Here: 1
Here: 2
[1,2]
Here: 3
[1,2,3]
Here: 4
[1,2,3,4 ]

所以指令似乎没有按顺序加载!直观地说,最终的顺序是 1,3,4,2,就像指令在页面上的布局方式一样。

Angular 是否在模板之间进行智能比较,并得出一些指令已经加载并在尝试新指令之前立即执行这些指令的结论?

当我们第二次导航回页面 B 时,加载正常。到底是怎么回事?

4

1 回答 1

1

我想我知道这是为什么。
因为 angular $templateCache 正在缓存,所以前两个指令在页面 A 加载后被缓存。

当我们转到页面 B 时,缓存的模板加载速度更快,因此 1 和 2 立即加载,3、4 被加载并放入 $templateCache。

下次当我们转到页面 B 时,所有内容都在 $templateCache 中,它们再次按顺序加载。

在生产中,我们首先将所有内容都放在模板缓存中,所以这不是问题。
否则,如果您关心指令的顺序,那将非常棘手。

于 2014-08-16T07:35:18.880 回答