AngularJS中控制器声明的差异

vin*_*nod 3 angularjs angularjs-controller

我已经看到控制器以两种方式声明,如下所示.但这有什么不同呢?

  1. appmodule.controller('Actrl',['$scope',function($scope) {}]);
  2. appmodule.controller('Actrl',function($scope) {});

但是,大多数时候,第一次不起作用.为什么?

Sha*_*wal 5

两种语法都是相同的,但如果你正在缩小你的代码,那么第一个是首选的(有一个拼写错误,见下面的描述).

Angular根据名称解析依赖关系,因此当您编写appmodule.controller('Actrl',function($scope) {});语法时,Angular会$scope通过读取参数名称来注入依赖关系$scope.但是当您的代码缩小为生产级别使用时,您的代码将变为:

appmodule.controller('Actrl', function(a) {});
Run Code Online (Sandbox Code Playgroud)

现在,Angular将无法使用名称解析依赖项a.这就是使用第一种方法的原因,即appmodule.controller('Actrl',['$scope', function($scope) {}]);.现在,当您的代码最小化以进行生产时,您的代码将如下所示:

 appmodule.controller('Actrl',['$scope', function(a) {}]);
Run Code Online (Sandbox Code Playgroud)

现在,角可以匹配基于索引的立场,即a是$scope.

您的代码中存在拼写错误,在function声明之前不应关闭列表.

阅读依赖关系注释,以获取有关内联数组注释主题的更多信息.

Angular通过注入器调用某些功能(如服务工厂和控制器).您需要注释这些函数,以便注入器知道要注入函数的服务.使用服务名称信息注释代码有三种方法:

  • 使用内联数组注释(首选)
  • 使用$ inject属性注释
  • 隐含地来自函数参数名称(有警告)

编辑: 关于两种不同风格的另一个更详细的描述:a-note-on-minification:

由于Angular将控制器的依赖关系从参数名称推断到控制器的构造函数,如果你要缩小PhoneListCtrl控制器的JavaScript代码,它的所有函数参数也将被缩小,并且依赖注入器将无法识别服务正确.

我们可以通过使用依赖项的名称来注释函数来克服这个问题,这些依赖项的名称是字符串,不会被缩小.有两种方法可以提供这些注入注释: