Question

我不知道最新发布的angularjs。我看到了一段代码如下

angular.module('app')
    .controller('myApp', [myApp]);

function myApp() {
      var vm = this;
      vm.title = 'Customers';
      vm.customers = [
        {name: 'Haley'}, {name: 'Ella'}, {name: 'Landon'}, {name: 'John'}
        ];
    };

代替我之前用来写的代码

angular.module('app')
    .controller('myApp', function($scope){
      $scope.title = 'Customers';
      $scope.customers = [
        {name: 'Haley'}, {name: 'Ella'}, {name: 'Landon'}, {name: 'John'}
        ];
});

那么我们为什么要注入控制器所需的功能呢？它提供了什么优势。如果我的理解是错误的，请纠正我。

Answer 1

该控制器未在其自己的依赖注入中使用。

这只是定义控制器的语法：

.controller('controllerName', [
    'dependency1', 
    'dependency2', 
    function (dependency1, dependency2) {
    }
]);

这种方法允许显式指定依赖项的名称，并且如果你缩小代码，可以防止你的依赖项搞砸了。

对于您的示例，没有依赖项，并且该函数被引用为变量而不是内联。

它还使用＆＃34;控制器作为＆＃34;语法（控制器将其自身称为this）而不是使用$scope服务，但这是完全独立的事情。

你也可以修改你的第二个例子，以同样的方式工作：

angular.module('app')
    .controller('myApp', ['$scope', myApp]);

function myApp($scope){
      $scope.title = 'Customers';
      $scope.customers = [
        {name: 'Haley'}, {name: 'Ella'}, {name: 'Landon'}, {name: 'John'}
        ];
}

Answer 2

它所做的不是从控制器调用匿名函数，而是将函数与控制器分开并调用函数。在这种情况下，函数名称为myApp

使用方括号调用它的原因是当你使用angular minify版本时，依赖注入器无法识别依赖项，因此它会产生错误。

为了通过注入器识别相关的依赖关系，angular允许您在初始化控制器时将依赖关系写为字符串数组。由于此示例中没有依赖项，因此仅显示空方括号。

如果您有依赖关系，请说$scope然后您需要像这样注入

angular.module('app')
    .controller('myApp', ['$scope',myApp]);

function myApp($scope) {
      var vm = this;
      vm.title = 'Customers';
      vm.customers = [
        {name: 'Haley'}, {name: 'Ella'}, {name: 'Landon'}, {name: 'John'}
        ];
    };

这也可以使用$inject

来完成

angular.module('app')
        .controller('myApp',myApp);

    myApp.$inject = ['$scope'];

    function myApp($scope) {
          var vm = this;
          vm.title = 'Customers';
          vm.customers = [
            {name: 'Haley'}, {name: 'Ella'}, {name: 'Landon'}, {name: 'John'}
            ];
        };

控制器在自己的依赖注入中

2 个答案: