Question

在AngularJS中加载模块的这两种方式之间的区别是什么：

var app = angular.module('app', ['ngRoute']);

// VERSION 1

app.controller('HomeCtrl', ['$scope', '$dep1', '$dep2', function($scope, $dep1, $dep2) {
    // controller code
}];

// VERSION 2

function HomeCtrl($scope, $dep1, $dep2){
    // controller code
}
HomeCtrl.$inject=['$scope', '$dep1', '$dep2'];
return HomeCtrl;

// Then load in the controller into the app module
app.controller('HomeCtrl', HomeCtrl);

Answer 1

两种方式都适用于缩小安全依赖注入。以下是源代码摘要injector.js file：

if (typeof fn === 'function') {
    if (!($inject = fn.$inject)) {
        $inject = [];

        // convert function to string, parse arguments

        fn.$inject = $inject;
    }
} else if (isArray(fn)) {
    last = fn.length - 1;
    assertArgFn(fn[last], 'fn');
    $inject = fn.slice(0, last);
} else {
    assertArgFn(fn, 'fn', true);
}
return $inject;

上面的代码很好地解释了如果你正在注入依赖项的函数，那么类型为

的功能

Angular检查此函数是否具有属性$inject，如果是，则此处是要注入的服务数组。

的阵列

Angular从这个数组中获取值，省去最后一个元素，这个元素应该是一个将值注入的实际函数。

注意我称为评论// convert function to string, parse arguments的部分。如果没有配置$inject属性并提供控制器/服务/等。实际上是一个函数类型，然后Angular将获取函数的字符串表示并解析它接受的字面定义的参数。然后获得的参数数组将用作注入服务。

因此，您可以看到差异很小。

Angular中注入模块的两种方式的区别

1 个答案: