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

发布时间：2020-12-17 08:01:43 所属栏目：安全来源：网络整理

导读：我对Javascript编程很新,我只涉及AngularJS.为了评估它,我决定编写一个简单的笔记应用程序.模型非常简单,每个音符都有标签,文本和标签列表.但是,我遇到了在隔离的嵌套指令范围之间传递数据的问题. 我有三个指令,注释,注释和标记(定义具有相同名称的新元素).

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

我有三个指令,注释,注释和标记(定义具有相同名称的新元素).他们每个人都使用一个孤立的范围.

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

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

note指令定义范围：{getNote：“&”,…},以便将笔记实例从笔记列表传递到笔记控制器/指令. getNote(index)函数在note指令的link函数中调用.这很好用！

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

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

> notes指令中的link函数
(将getNote函数添加到notes范围)
>第一个音符的tagger指令中的link函数
(在父笔记范围内调用getTags)函数
>第一个note指令中的link函数
(将getTags添加到范围)
(在父笔记范围内调用getNote)
>第二个音符的tagger指令中的link函数
(在父笔记范围内调用getTags)函数
>第二个note指令中的link函数
(将getTags添加到范围)
(在父笔记范围内调用getNote)

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

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

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

(我在tagger指令中使用$watch on getTags解决了问题…)

问候

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

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

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

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

directive1: compile

directive2: compile

directive1：控制器

directive1：预链接

directive2: controller

directive2: pre-link

directive2: post-link

directive1：post-link

默认情况下,直接“链接”函数是一个后链接,因此外部指令1的链接函数在内部指令2的链接函数运行之后才会运行.这就是为什么我们说在后链接中进行DOM操作是唯一安全的. “

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!