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

Question

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

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

相关的控制器代码如下:

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

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

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

我想知道而不是在'this'中添加函数,为什么不将它添加到$ scope本身,特别是当我们使用隔离范围时？

代码向$ scope 添加函数:向 $ scope 添加函数

相关的控制器代码如下:

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");
        };
    },

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

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

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

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");
        };
    },

我很确定使用控制器和这个对象是有正当理由的.我无法理解为什么.

Answer 1

您是正确的，您可以在函数中公开函数link并获得相同的结果。指令控制器有点奇怪，但随着我编写了更复杂的指令，我决定将尽可能多的行为推送到控制器中，并将与 DOM 相关的内容留在函数中link。原因是：

• 我可以传入控制器名称，而不是将函数放在指令中；IMO 事情变得更干净
• 控制器可以公开在同级或相关指令内部使用的公共 API，以便您可以进行一些互操作并鼓励 SoC。
• 如果您愿意，您可以将控制器测试与指令编译分开。

我通常只在可能存在复杂的状态转换、正在处理的外部资源（即 $http）或需要重用时才引入控制器。

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