为什么我的指令模块未包含在我的Angular应用程序模块中？

Question

刚学习Angular时，我遇到了一些模块解析问题。 在js/directives/directives.js我将以下指令限制为directives模块：

angular.module("directives").directive("selectList", function() {
    return {
        restrict: 'E',
        link: function() {
            // do stuff 
        }
    }
});

在我的网页上：

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.js"></script>
<script>
    angular.module("editUserApp", ["directives"])
        .controller("editUserController", ['$http', '$scope', function($http, $scope) {
            // do stuff here 
        }]
    );
</script>

我收到的错误如下：

Error: [$injector:modulerr] Failed to instantiate module editUserApp due to:
[$injector:modulerr] Failed to instantiate module directives due to:
[$injector:nomod] Module 'directives' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.

现在，很明显， editUserApp本身不知道directives在哪里，那么我如何告诉它获取指令editUserApp文件？ 我是否必须将其包含在脚本标签中（似乎不是很可扩展）？

我需要某种方式将指令导入我的角度应用程序。 我怎样才能做到这一点？

Answer 1

你需要

angular.module("directives" ,[])

在你的第一个街区

angular.module("directives")

尝试找到称为指令的现有模块

---

如果您正在寻找一种根据需要导入这些文件的方法，则可能需要查看http://requirejs.org/或http://browserify.org/或类似的工具。

Answer 2

您需要将js / directives / directives.js文件包含到html中，并删除App模块上的指令依赖项。

您的代码应为：

    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.js"></script>
    <script>
    angular.module("editUserApp", [])
        .controller("editUserController", ['$http','directives', '$scope', function($http, $scope,directives) {
            // do stuff here 
        }]
    );
    </script>