【问题标题】:Failed to instantiate module demoApp due to: Error: [$injector:nomod] Module 'demoApp' is not available由于以下原因无法实例化模块 demoApp:错误:[$injector:nomod] 模块“demoApp”不可用
【发布时间】:2016-11-07 07:31:15
【问题描述】:

我正在尝试使用 Angular 和 ngRoute/ngView 构建一个简单的 SPA。我根本无法让它工作。

我得到错误:angular.js:68 未捕获的错误:[$injector:modulerr] 无法实例化模块 demoApp,原因如下: 错误:[$injector:nomod] 模块“demoApp”不可用!您要么拼错了模块名称,要么忘记加载它。如果注册模块,请确保将依赖项指定为第二个参数。

我查看了网络上的各种代码示例以及 youtube 教程,并将我的代码与他们的代码进行了比较,但我根本无法弄清楚我做错了什么。在我看来,它们看起来一模一样。

我提前道歉,这似乎是过去被问过很多的问题,但以前的答案对我没有任何帮助。

这是我的 HTML 文件,名为“test.html”。

<html ng-app="demoApp">
  <head>
        <title>My Angular App</title>

  </head>

  <body>
      <h2>DemoApp Demo</h2>
        <div>
            <a href="#/partial1.html">Partial 1</a>
            <a href="#/partial2.html">Partial 2</a>
            <div ng-view></div>     
        </div>
        <script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.js"></script>
        <script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular-route.js"></script>
        <script src = "demoApp.js" />
  </body>
</html>

这是“demoApp.js”,和test.html在同一个目录

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

demoApp.config(['$routeProvider', function($routeProvider) {
    $routeProvider

        .when('/partial1',
        {
            controller: 'SimpleController',
            templateUrl: 'Partials/partial1.html'
        }).when('/partial2',
        {
            controller: 'SimpleController',
            templateUrl: 'Partials/partial2.html'
        }).otherwise({redirectTo: '/partial1'});
}]);


demoApp.controller('SimpleController', function($scope){
    $scope.customers = [
        {name:'Victor', city:'Norrköping'}, 
        {name:'Mikael', city:'Göteborg'}, 
        {name:'Jocke',  city:'Göteborg'}, 
        {name:'Skåne',  city:'Ystad'}
    ];

    $scope.addCustomer = function(){
        $scope.customers.push(
        {
            name: $scope.newCustomer.name, 
            city: $scope.newCustomer.city
        });
    }
});

我没有包含 Partial1 和 Partial2,因为它们似乎与问题无关,因为它们只是没有脚本的简单 HTML 文件。

【问题讨论】:

    标签: javascript angularjs single-page-application ngroute


    【解决方案1】:

    你的错误就在这条线上

    <script src="..." />
    

    你不能有自闭script标签,所以应该是

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

    Plunker 演示答案:http://plnkr.co/edit/Mz1GRSFRxaUN9q6gUONl

    【讨论】:

    • 认为这将是愚蠢的事情。不知道你不能用'/'结束脚本标签。非常感谢,你治好了我的头痛。
    • 不客气,哈哈,我也已经用愚蠢的东西击中了头。欢迎来到 AngularJS 世界!
    猜你喜欢
    • 2019-08-17
    • 1970-01-01
    • 1970-01-01
    • 2022-08-22
    • 2023-03-27
    • 2018-09-29
    • 1970-01-01
    • 2016-05-23
    • 1970-01-01
    相关资源
    最近更新 更多