将函数添加到$ scope和指令控制器中的区别？

When going through egghead video, the one about Directive to directive communication suggests we use controller to add functions to 'this' object and access it from other directives.

在浏览egghead视频时,关于指令通信的指令建议我们使用控制器向'this'对象添加函数并从其他指令访问它。

The full code used in the video : Adding functions to this object

视频中使用的完整代码:向此对象添加功能

The relevant controller code is as follows :

相关的控制器代码如下:

controller: function($scope){
        $scope.abilities = [];
        $scope.addStrength = function(){
            $scope.abilities.push("Strength");
        };

        $scope.addSpeed = function(){
            $scope.abilities.push("Speed");
        };

        $scope.addFlight = function(){
            $scope.abilities.push("Flight");
        };
    },

Or why have the controller function at all. Why can not we use the link function to achieve the same result?

或者为什么控制器功能完全正常。为什么我们不能使用link函数来实现相同的结果?

Adding functions to $scope in the link function : Using link funtciont instead of controller

在链接函数中向$ scope添加函数:使用链接funtciont而不是控制器

The relevant controller and link function is as follows :

相关的控制器和链接功能如下:

controller: function($scope){
        $scope.abilities = [];
        $scope.addStrength = function(){
            $scope.abilities.push("Strength");
        };

        $scope.addSpeed = function(){
            $scope.abilities.push("Speed");
        };

        $scope.addFlight = function(){
            $scope.abilities.push("Flight");
        };
    },

I am pretty sure there is valid reason to use controller and this object. I am not able to understand why. If somebody could explain that would be helpful.

我很确定使用控制器和这个对象是有正当理由的。我无法理解为什么。如果有人能够解释这将有所帮助。

1 个解决方案

#1

You are correct that you can expose functions in the link function and get the same results. Directive controllers are a bit of an odd bird, but as I've written more complex directives, I've settled on pushing as much behavior into controllers and leaving DOM-related stuff in the link function. The reason why is:

您是正确的,您可以在链接功能中公开函数并获得相同的结果。指令控制器有点奇怪,但是当我编写更复杂的指令时,我已经决定将更多的行为推送到控制器中并将与DOM相关的东西留在链接函数中。原因是:

I can pass in a controller name instead of having the function inside my directive; things get cleaner IMO

我可以传入一个控制器名称,而不是在我的指令中包含该函数;事情变得更清洁IMO

The controllers can expose public APIs used inside of sibling or related directives so you can have some interop and encourage SoC.

控制器可以公开兄弟或相关指令中使用的公共API,这样你就可以有一些互操作并鼓励SoC。

You can isolate the controller testing apart from the directive compilation if you like.

如果您愿意,可以将控制器测试与指令编译隔离开来。

I typically only introduce controllers when there are perhaps complex state transitions, external resources being handled (ie $http), or if reuse is a concern.

我通常只在可能存在复杂的状态转换,处理外部资源(即$ http)或者重用是一个问题时才引入控制器。

You should note that Angular 1.2 exposes 'controllerAs' on directives which allows you to directly consume the controller in directive templates and reduce a bit of the ceremony the $scope composition introduces.

您应该注意Angular 1.2在指令上公开'controllerAs',它允许您直接使用指令模板中的控制器并减少$ scope组合引入的一些仪式。

#1

I can pass in a controller name instead of having the function inside my directive; things get cleaner IMO