无法实例化模块AngularJS

时间:2014-08-15 08:27:50

标签: javascript angularjs error-handling

我遇到的问题是由于$ routeProvider,我的应用程序无法实现我的模块。

Herer是我的控制者:

var gameApp = angular.module("gameApp", []);

gameApp.controller("firstPageCtrl", function($scope,$http,$location) {
    $scope.doLogin = function() {
        $http.post("lib/action.php", {username: $scope.username, password: $scope.password}).success(function(data) {
            console.log(data);
        }).error(function(data) {
            console.log(data);
        });
    };
});

gameApp.config(function($routeProvider) {
    $routeProvider

    .when('/', {
            templateUrl : 'partials/firstpage.html',
            controller  : 'firstPageCtrl'
    })

    .when('/game', {
            templateUrl : 'partials/game.html',
            controller  : 'gameCtrl'
    });
});


gameApp.controller("gameCtrl", function($scope,$http,$location) {

});

我无法在代码中看到错误。任何人?

以下是错误消息:

Error: [$injector:modulerr] Failed to instantiate module gameApp due to: [$injector:unpr] Unknown provider: $routeProvider

这是我的index.html文件:

<!DOCTYPE html>
<html ng-app="gameApp">
<head>
<script src="js/angular.js"></script>
<link href="css/style.css" rel="stylesheet" type="text/css">
<meta content="text/html;charset=UTF-8" http-equiv="content-type" />
<script src="js/mastercontroller.js"></script>
</head>
<body>
<div id="layout">
    <div id="topcontent">
    </div>
    <div id="middlecontent" ng-controller="firstPageCtrl">
        <div ng-view></div>
    </div>
    <div id="bottomcontent">
        {{"AngularJS"}}
    </div>
</div>
</body>
</html>

2 个答案:

答案 0 :(得分:0)

这是因为没有$routeProvider的提供者。

说出像bellow

之类的东西
gameApp.config(['$routeProvider',function($routeProvider) {
    $routeProvider

    .when('/', {
            templateUrl : 'partials/firstpage.html',
            controller  : 'firstPageCtrl'
    })

    .when('/game', {
            templateUrl : 'partials/game.html',
            controller  : 'gameCtrl'
    });
}]);

答案 1 :(得分:0)

您需要将angular-route脚本加载到HTML页面中。

  <script src="angular-route.js">

(此网址可能不是您的具体情况,但您明白了。)

然后,您需要声明对ngRoute模块的依赖。

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