AngularJS:如何在HTML编译安排编制的顺序?(AngularJS : How does t

2019-07-20 05:59发布

当有多个元素的多个指令,一个页面上,如何角的HTML编译安排编制的顺序?

说我有以下的标记,其中的α,β,γ是自定义角的指令,

<html ng-app>
  <alpha><beta></beta></alpha>
  <gamma></gamma>
</html>

什么是编译器就会对他们的工作秩序? 它是阿尔法=>伽马=>测试版? 或者是它的α=>的β=>伽马?

要的东西多一点复杂,考虑阿尔法指令的模板有另一个自定义指令,叫做foo。 当将富被编译? 所有上述指令后得到编译? 或Alpha之后编译?

Answer 1:

我问同样的问题在AngularJS邮件列表和彼得·培根达尔文为与示范一个的jsfiddle一个伟大的答案。 链接



Answer 2:

关于一个元件上的多个指令

这是使用指令“优先”财产处理。 从文档: Once all directives for a given DOM element have been identified they are sorted by priority and their compile() functions are executed.

见http://docs.angularjs.org/guide/directive

对于指令编译命令

角将遍历DOM - 即拿起它们出现在DOM树的顺序的元素。 从文档: Compile: traverse the DOM and collect all of the directives. The result is a linking function. Compile: traverse the DOM and collect all of the directives. The result is a linking function.

见http://docs.angularjs.org/guide/compiler



Answer 3:

的链接和编译功能的顺序在其他的答案和的$在编译功能的角度文档中有很好的描述https://docs.angularjs.org/api/ng/service/$compile :

  1. 编译和链接预自上而下(首先父母,然后孩子)
  2. 围绕后链接的其他方式
  3. 在相同的元素指令是由它们的优先级处理的属性

另外:4.当使用在指令中templateUrl选项,该指令将无法编译,直到模板被加载,但是编译器将继续编制其他指令。 这将中断上述编译/链接顺序。



文章来源: AngularJS : How does the HTML compiler arrange the order for compiling?