Angular JS：当我们已经有了具有作用域的指令控制器时，还需要指令的链接功能吗？

小编典典

Angular JS：当我们已经有了具有作用域的指令控制器时，还需要指令的链接功能吗？

all

我需要对范围和模板执行一些操作。似乎我可以在link函数或controller函数中做到这一点（因为两者都可以访问范围）。

什么时候我必须使用link功能而不是控制器？

angular.module('myApp').directive('abc', function($timeout) {
    return {
        restrict: 'EA',
        replace: true,
        transclude: true,
        scope: true,
        link: function(scope, elem, attr) { /* link function */ },
        controller: function($scope, $element) { /* controller function */ }
    };
}

另外，我知道那link是无角度的世界。所以，我可以使用$watch,$digest和$apply。

link当我们已经有了控制器时，该功能的意义是什么？

阅读 62

2022-06-24

共1个答案

小编典典

在我最初link与and函数斗争controller并阅读了很多关于它们的内容之后，我想现在我有了答案。

首先让我们了解，

简而言之，角度指令如何工作：

我们从一个模板开始（作为一个字符串或加载到一个字符串）

var templateString = '<div my-directive>{{5 + 10}}</div>';

现在，这templateString被包装为一个 角度元素

var el = angular.element(templateString);

有了el，现在我们用编译它$compile来取回链接函数。

var l = $compile(el)

这是发生的事情，

* `$compile`遍历整个模板并收集它识别的所有指令。
* 发现的所有指令都被 **递归编译** 并收集它们的`link`功能。
* 然后，所有`link`函数都包装在一个新`link`函数中并以`l`.

最后，我们为scopethis l(link) 函数提供函数，该函数进一步使用 thisscope及其对应元素执行包装的链接函数。

l(scope)

这将template作为新节点添加到DOM并调用controller，将其监视添加到与 DOM 中的模板共享的 范围。

在此处输入图像描述

比较编译与链接与 控制器 ：

每个指令只编译一次，链接函数被保留以供重复使用。因此，如果有适用于指令的所有实例的东西，应该在指令的compile函数内执行。
现在，在编译之后，我们有了在将模板* 附加到 DOMlink时执行的函数。因此，我们执行特定于指令每个实例的所有操作。例如： 附加事件 ， 根据范围改变模板 等。 ***
最后，当指令在（连接后）工作时， 控制器 应该是可用的实时和反应性的。DOM所以：

(1) 用链接设置视图[ V* ]（即模板）后。$scope是我们的 [ M ] 并且是我们在
MVC$controller中的 [ C ] *

(2)通过设置手表来利用与 $scope的* 2-way 绑定。 *

(3)$scope预计将在控制器中添加监视，因为这是在运行时监视模板的内容。

(4)
最后，controller也用于能够在相关指令之间进行通信。（myTabs例如 https://docs.angularjs.org/guide/directive中的示例）

(5) 的确，我们也可以在link函数中完成所有这些，但它是关于 关注点分离的 。

因此，最后我们有以下完美契合所有部分的内容：

在此处输入图像描述

2022-06-24