未捕获错误:[$ injector:modulerr]由于以下原因无法实例化模块:

时间:2014-08-10 16:35:09

标签: javascript html angularjs requirejs

首先我要说的是,我已经查看了与我的问题相关的所有现有问题,但我发现没有任何问题可以解决我的问题。

Uncaught Error: [$injector:modulerr] Failed to instantiate module Arrows due to:
Error: [$injector:nomod] Module 'Arrows' is not available! You either misspelled the         
module     name or forgot to load it. If registering a module ensure that you specify ...    
<omitted>...2) 

我的index.html:

<html ng-app='Arrows'>
    <head>
        <title>Arrows</title>
        <script data-main="app" src="modules/require.js"></script>
        <link rel="stylesheet" type="text/css" href="styles/style.css">
        <script src="modules/angular-1.2.21/angular.js"></script>
        <script src="modules/angular-1.2.21/angular-route.js"></script>
    </head>
    <body ng-controller='menuController'>       
        <div ng-view>
            {{ message }}
        </div>  
    </body>
</html>

我的app.js:

define([
    './controller/menu',
    './controller/game'
], function( 
    menu,
    game
) {

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

    Arrows.config(function($routeProvider) {
        $routeProvider
            .when('/', {
                templateUrl : 'pages/menu.html',
                controller  : 'menuController'
            })
            .when('/game', {
                templateUrl : 'pages/game.html',
                controller  : 'gameController'
            })
            .otherwise( {
                redirectTo: '/', 
                controller: 'menuController'
            }); 
    });

    Arrows.controller('gameController', function($scope) {
        $scope.message = 'hello! Its working!';
    });

    Arrows.controller('menuController', function($scope) {
        $scope.message = 'hello! Its working!';
    });
});

不知道该怎么做。我的意思是,我加载了 angular-route.js ,关于这个错误的大多数问题的答案是什么。我确保在html标签内写下 ng-app ='Arrows'

1 个答案:

答案 0 :(得分:1)

当您使用require.js时,您必须以特殊方式引导AngularJS应用程序。阅读本文 - https://www.startersquad.com/blog/angularjs-requirejs/ - 并尝试将针对您具体案例的内容纳入其中。

最后你会使用像

这样的东西
define([
   'require',
   'angular'
], function (require, ng) {
    'use strict';

    require(['domReady!'], function (document) {
       ng.bootstrap(document, ['Arrows']);
   });
});