一尘不染

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

angularjs

也许我对指令控制器的工作原理有一个基本的误解,据我了解,它们被用作暴露给其他指令和控制器的一种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?还是我完全错过了重点?


阅读 195

收藏
2020-07-04

共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

2020-07-04