我对Javascript编程还很陌生,只接触过AngularJS。为了对其进行评估,我决定编写一个简单的note应用程序。该模型非常简单,它是一个注释列表,其中每个注释都有一个标签,一个文本和一个标签列表。但是,我遇到了在嵌套指令的隔离范围之间传递数据的问题。
我有三个指令,注释,注释和标记(定义具有相同名称的新元素)。他们每个人都使用隔离范围。
notes指令使用ng-repeat来“渲染”其带有note元素的每个注释。
note指令使用tagger元素“呈现”标签列表。
note指令定义了范围:{getNote:“&”,…},以便将注释实例从注释列表传递到注释控制器/指令。在note指令的链接函数中调用getNote(index)函数。这样很好!
tagger指令定义范围:{getTags:“&”,…},以便将给定注释的标签列表传递给tagger控制器/指令。在tagger指令的链接函数中调用getTags函数。这行不通!
据我了解,问题在于指令的链接函数以不一致的顺序被调用。对该应用程序进行调试,显示链接函数按以下顺序调用:
notes指令中的链接函数(将getNote函数添加到notes范围)
第一个注释的tagger指令中的链接函数(在父注释范围中调用getTags)函数
第一个note指令中的link函数(将getTags添加到范围)(在父Notes范围中调用getNote)
第二个注释的tagger指令中的链接函数(在父注释范围中调用getTags)函数
第二个note指令中的link函数(将getTags添加到范围中)(在父Notes范围中调用getNote)
这将不起作用,因为在第二个注释中,第一个注释的范围还没有getTags函数。
在Plunker中可以找到一个简单的例子。
因此,我的问题归结为:是什么决定了嵌套指令中链接函数的调用顺序。
(我在tagger指令中的getTags上使用$ watch解决了这个问题…)
问候
引用乔什·D·米勒(Josh D. Miller)的话,他曾回答过我一个类似的问题:
“仅是一些技术说明。假设您具有以下标记:
<div directive1> <div directive2> <!-- ... --> </div> </div>
现在,AngularJS将通过以一定顺序运行指令函数来创建指令:
指令1:编译 指令2:编译 指令1:控制器 指令1:预链接 指令2:控制器 指令2:预链接 指令2:链接后 指令1:链接后
指令1:编译
指令2:编译
指令1:控制器
指令1:预链接
指令2:控制器 指令2:预链接 指令2:链接后
指令2:控制器
指令2:预链接
指令2:链接后
指令1:链接后
默认情况下,直接的“链接”功能是后链接,因此,外部指令1的链接功能将在内部指令2的链接功能运行后才能运行。这就是为什么我们说在后链接中进行DOM操作是唯一安全的原因。”