6

在浏览 Egghead 视频时，关于Directive to direct communication的视频建议我们使用控制器向 '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");
        };
    },

或者为什么有控制器功能。为什么我们不能使用链接功能来达到同样的效果？

在链接函数中向 $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");
        };
    },

我很确定有充分的理由使用控制器和这个对象。我无法理解为什么。

4

1 回答 1

4

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

  • 我可以传入控制器名称，而不是在指令中包含函数；事情变得更清洁 IMO
  • 控制器可以公开在兄弟或相关指令中使用的公共 API，因此您可以进行一些互操作并鼓励 SoC。
  • 如果您愿意，您可以将控制器测试与指令编译隔离开来。

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

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

于 2013-09-02T07:33:39.970 回答