javascript - 缩小时的 Angular 注入(inject)

Question

这段代码可以工作，但缩小后就不行了...我该怎么办？我收到此错误错误:

$注入(inject)器:strictdi需要显式注释

//app.js

angular
 .module('app', [route, 'templates']);

angular
 .module('app')
 .config(config);

function config($routeProvider, $locationProvider) {
 $routeProvider

.when('/', {
  templateUrl: 'home.html',
  controller: 'HomeController',
  controllerAs: 'vm'
});

$locationProvider.html5Mode(true);
}


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

function HomeController() {
 var vm = this;
 vm.header = 'Home';
}

//home.html

{{ vm.header }}

Answer 1

Angular 尝试通过参数名称隐式加载依赖项，只要参数名称与您要加载的依赖项相同，它就可以正常工作。

例如，

function config($routeProvider, $locationProvider) {
    ...
}

这将触发 Angular 使用 $routeProvider 和 $locationProvider 注入(inject)函数，但是如果将代码缩小为这样会发生什么:

function config(a, b) {
    ...
}

Angular 现在将尝试使用 a 和 b(不存在)注入(inject)函数。因此，您需要明确告诉 Angular 您想要注入(inject)哪些依赖项。您可以使用内联括号表示法来完成此操作:

// bracket notation
angular
    .module('app')
    .config(['$routeProvider', '$locationProvider', config]);

function config($routeProvider, $locationProvider) {
    ...
}

...或者使用 $inject 属性:

// $inject property
angular
    .module('app')
    .config(config);

config.$inject = ['$routeProvider', '$locationProvider'];
function config($routeProvider, $locationProvider) {
    ...
}