在嵌套和重复的angularjs指令中调用链接函数的顺序

Question

我对Javascript编程很新，我只涉及AngularJS。为了评估它，我决定编写一个简单的笔记应用程序。模型非常简单，每个音符都有标签，文本和标签列表。但是，我遇到了在隔离的嵌套指令范围之间传递数据的问题。

我有三个指令，注释，注释和标记器（定义具有相同名称的新元素）。他们每个人都使用一个孤立的范围。

notes指令使用ng-repeat来使用note元素“渲染”其每个音符。

note指令使用tagger元素“呈现”标记列表。

note指令定义范围：{getNote：“＆amp;”，...}，以便将笔记实例从笔记列表传递到笔记控制器/指令。 getNote（index）函数在note指令的link函数中调用。这很好用！

tagger指令定义范围：{getTags：“＆amp;”，...}，以便将给定注释的标签列表传递给tagger控制器/指令。 getTags函数在tagger指令的link函数中调用。这不起作用！

据我了解，问题是指令的链接函数以不一致的顺序调用。调试应用程序显示链接函数按以下顺序调用：

1. notes指令中的链接功能 （将getNote函数添加到备注范围）

2. 第一个音符的tagger指令中的链接功能 （在父笔记范围内调用getTags）函数

3. 第一个note指令中的链接函数 （将getTags添加到范围） （在父笔记范围内调用getNote）

4. 第二个音符的tagger指令中的链接功能 （在父笔记范围内调用getTags）函数

5. 第二个note指令中的链接函数 （将getTags添加到范围） （在父笔记范围内调用getNote）

这不起作用，因为在＃2中，第一个音符的范围还没有getTags函数。

可以在Plunker中找到一个简单的例子。

因此，我的问题归结为：什么决定了在嵌套指令中调用链接函数的顺序。

（我在tagger指令中使用$ watch on getTags解决了问题...）

问候

Answer 1

引用乔什·D·米勒（Josh D. Miller）对我曾遇到的类似问题做出了回应：

“只需​​要几个技术说明。假设你有这个标记：

<div directive1>
  <div directive2>
    <!-- ... -->
  </div>
</div>

现在AngularJS将通过按特定顺序运行指令函数来创建指令：

  

directive1：compile

     

    

      

指令2：编译

    

  

     

指令1：控制器

     

指令1：预链接

     

    

      

指令2：控制器

             

指令2：预链接

             

指令2：后链接

    

  

     

指令1：后链接

默认情况下，直接“链接”功能是一个后链接，所以你的外部directive1的链接函数将在内部指令2的链接函数运行之后才会运行。这就是为什么我们说在后链接中进行DOM操作是唯一安全的。 “

Answer 2

在单个元素上，链接函数的顺序由编译函数的顺序决定，而编译函数的顺序又根据指令定义对象的priority属性进行排序。

来源：http://docs.angularjs.org/guide/directive

在具有包含的多个元素上：在外部指令之前评估内部指令。原因：交叉的性质。

在具有兄弟姐妹的多个元素上：按顺序从上到下执行。原因：解析$ compile的逻辑。