Uncaught Error: Module 'myApp' is not available! (AngularJS)

Question

我正在编写 angular 教程，但我在开始时遇到了问题。加载 myApp 模块会引发错误。如教程中所述，这应该是创建控制器的三种方法之一。

这是我正在处理的教程的打印屏幕：

当我刷新网页时，我在 Chrome 控制台中收到此错误：

Uncaught Error: [$injector:modulerr] Failed to instantiate module myApp due to:
Error: [$injector:nomod] Module 'myApp' 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.

这是我的 HTML 文件

  <html ng-app="myApp">
        <head>
        </head>
        <body>
            <h1>Hello world!</h1>   

            <div ng-controller="MainController">
                {{ 2+2 }}
                <br>
                {{ val }}
            </div>
            <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.js"></script>
            <script src="app.js">
        </body>
    </html>

这是我的 app.js 文件

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

var MainController = function($scope){
    $scope.val = "Main controller variable value"
}

那么我的问题是什么？想不通了。

提前致谢

Answer 1

您应该将 controller 注册到 angular 模块 myApp。

App.js

var myApp = angular.module('myApp', []);
myApp.controller('MainController', MainController );
var MainController = function($scope){
    $scope.val = "Main controller variable value"
}

基本上你所做的是正确的，但是旧版本的 AngularJS 遵循了该代码，你声明控制器的方式只不过是被称为 controller As 函数，需要启用 [= $controllerProvider 的 14=] 方法。由于 Angular 1.3 + allowGlobals() 方法通过添加以下代码被禁用，您可以将其打开，以使您的代码正常工作，但不推荐这样做。

配置

myApp.config(['$controllerProvider',
  function($controllerProvider) {
    $controllerProvider.allowGlobals();
  }
]);

在此处引用相同的

Answer 2

试试这个：

myApp.controller ("MainController",[$scope, function ($scope){
      $scope.val = "Main controller variable value"
}]);

ng-controller 指令在您的 MyApp 模块中查找 MainController。

Answer 3

Module 'myApp' 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.

您最初的问题是由于无效的脚本标签造成的。基本上你的脚本标签没有关闭它需要关闭以便浏览器下载 app.js 文件。脚本标签不会自动关闭，因此需要一个结束标签。

<script src="app.js">

应该是

<script src="app.js"></script>

现在，一旦您修复了该错误，您将遇到另一个错误。

[ng:areq] Argument 'MainController' is not a function, got undefined

因为您使用的是最新的 angular 版本，即任何 >= 1.3.x 需要使用 .controller 构造手动注册控制器。 See here for more details.

注意 - 这有点令人困惑，因为屏幕截图显示您使用的是 1.2.0（不一定需要显式控制器注册），但问题 1.4.x 中显示了片段。

Uncaught Error: Module 'myApp' is not available! (AngularJS)

Uncaught Error: Module 'myApp' is not available! (AngularJS)

html

javascript

angularjs

angularjs-directive

angularjs-controller