在同一指令的链接功能内使用指令控制器中的功能

Question

也许我对指令控制器的工作原理有一个基本的误解，据我了解，它们被用作暴露给其他指令和控制器的一种API。我正在尝试使控制器和链接功能进行内部通信。

例如，我希望能够通过控制器函数设置一个变量，然后在链接函数中使用它：

var app = angular.module('test-app', []);

app.directive('coolDirective', function () {
    return {
        controller: function () {
            this.sayHi = function($scope, $element, $attrs) {
                $scope.myVar = "yo"
            }
        },
        link: function(scope, el, attrs) {
            console.log(scope.myVar);
        }   
    }
});

如何在链接功能中访问myVar或sayHi？还是我完全错过了重点？

Answer 1

控制器的$ scope（在控制器中定义，而不在sayHi函数中定义）和链接scope都相同。可以从链接中使用在控制器中设置的内容，反之亦然。

您遇到的问题sayHi是该函数永远不会触发，因此myVar永远不会设置。

由于sayHi不在范围内，因此需要引用控制器并执行该操作，因此可以添加第四个参数，如下所示：

link: function(scope, element, attr, ctrl) {}

然后，您可以做一个ctrl.sayHi()（但同样，那些参数sayHi属于控制器功能。）

如果您需要另一个控制器，但仍想使用其自己的指令，那么您也将需要它。因此，如果coolDirective需要访问您的控制器，notCoolAtAll可以执行以下操作：

require: ['coolDirective', 'notCoolAtAll']

这样就可以了。link然后，该函数将接收一个控制器数组作为第四个参数，在这种情况下，第一个元素为coolDirectivectrl，第二个元素为ctrl
notCoolAtAll。

这是一个小例子：http :
//plnkr.co/edit/JXahWE43H3biouygmnOX?p=preview