为什么在定义组件时不能省略angular.module中的模块依赖

Question

主要模块app.js：

angular.module("myApp",["phoneList"]);

我按照tutorial制作名为phoneList

的sperate组件模块

angular.module("phoneList")
                      //^ omit the empty bracket here, cause no dependency needed
    .component('phoneList', {
        templateUrl: 'template/phone-list.html',
        controller: function (){
            this.phones = [
                {name: "iphone", snippet: "designed by apple"},
                {name: "nexus", snippet: "phone that could explode"}
            ]}

});

但它会抱怨：

angular.min.js:6 Uncaught Error: [$injector:nomod] http://errors.angularjs.org/1.6.1/$injector/nomod?p0=phoneList
    at angular.min.js:6
    at angular.min.js:25
    at b (angular.min.js:24)
    at Object.module (angular.min.js:25)
    at phone-list.js:5

当我添加空[]时：

angular.module("phoneList",[])
     .component(//balabla)

事情会好起来的。我检查了API Reference，它表明依赖是可选的，因此可以省略。

那么问题是什么原因造成的？

Answer 1

根据文件，

  

angular.module（name，[requires]，[configFn]）;

     

如果指定，则创建新模块。如果未指定则   正在检索模块以进行进一步配置。

这意味着你需要传递一个空数组[]。要使其在没有任何依赖模块的情况下工作，您可以将其用作

angular.module("phoneList",[])

<强>更新

如果已经声明了模块，则不必再次传递依赖项。因此，您可以将组件/控制器/服务/工厂用作

angular.module('phoneList').controller(...)...

Answer 2

一旦定义了模块，就可以在没有第二个参数的情况下引用它。你第一次这样做。

因此...

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

是正确的。

Answer 3

这是因为在第二个参数中传递数组会告诉angular创建一个具有所有依赖关系的模块的新实例。如果您没有任何依赖项，则必须传递一个空数组才能创建新模块。

通过省略此参数，您可以请求angular来检索现有模块。而且，在您的代码中，您没有以前名为phoneList的模块。这就是它给你错误的原因。