AngularJS ngRoute throwing Uncaught Error: [$injector:module

AngularJS ngRoute throwing Uncaught Error: [$injector:modulerr]

本文关键字：injector module Error ngRoute throwing Uncaught AngularJS      更新时间：2023-09-26

嗨，我开始使用angularjs v1.4.7和angular-route v1.5.0来开发spa。

在我的项目结构是:

- static
-- js
---- libs
------ angular.min.js
------ angular-route.min.js
---- app.js
- web
-- views
----- ... my views ...
-- index.html

我在浏览器控制台得到这个错误:

Uncaught Error: [$injector:modulerr]

我指数:

<!DOCTYPE html>
<html ng-app="app">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
    <link rel="stylesheet" href="../static/bootstrap-3.3.5/css/bootstrap.min.css" />
    <link rel="stylesheet" href="../static/css/app.css" />
    <title>
        JM2
    </title>
    <script type="text/javascript" src="../static/js/libs/jquery-2.1.4.min.js"></script>
    <script type="text/javascript" src="../static/bootstrap-3.3.5/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="../static/js/libs/angular.min.js"></script>
    <script type="text/javascript" src="../static/js/libs/angular-route.min.js"></script>
    <script type="text/javascript" src="../static/js/app.js"></script>
</head>
<body>
    <nav class="navbar navbar-default">
        <div class="container-fluid">
            <div class="navbar-header">
                <button type="button" 
                    class="navbar-toggle collapsed"
                    data-toggle="collapse" 
                    data-target="#navbar"
                    aria-expanded="false">
                    <span class="sr-only">Toggle navigation</span> 
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="#">
                    JM2
                </a>
            </div>
            <div class="collapse navbar-collapse"
                id="navbar">
                <ul class="nav navbar-nav">
                    <li role="presentation">
                        <a href="#">
                            Home
                        </a>
                    </li>
                    <li role="presentation">
                        <a href="#builds">
                            Builds
                        </a>
                    </li>
                </ul>
                <ul class="nav navbar-nav navbar-right">
                    <li role="presentation">
                        <a href="#admin">
                            Admin
                        </a>
                    </li>
                </ul>
            </div>
        </div>
    </nav>
    <div class="container-fluid">
        <div ng-view></div>
    </div>
</body>
</html>
我app.js

: 

var app = angular.module('app', ['ngRoute']);
app.config(['$routeProvider'], function($routeProvider) {
$routeProvider
    .when('/', {
        templateUrl: 'views/home.html',
        controller: 'homeController'
    })
    .when('/builds', {
        templateUrl: 'views/builds.html',
        controller: 'buildsController'
    })
    .when('/admin', {
        templateUrl: 'views/admin.html',
        controller: 'adminController'
    })
    .otherwise({
        redirectTo: '/'
    });
});
app.controller('homeController', function($scope) {
});
app.controller('buildsController', function($scope) {
});
app.controller('adminController', function($scope) {
});

为什么我有这个错误?我读了一些问题，你说的都是angular-route导入的问题，但我已经导入了。

非常感谢。

提到的依赖项是不正确的。你需要传递一个数组，其中依赖项的名称为字符串，函数作为数组中依赖项在同一序列中的最后一个元素。

Change app.config(['$routeProvider'], function($routeProvider) { 

app.config(['$routeProvider', function($routeProvider) {
//                          ^          Removed ]
...
...
}]); // <----- Add ] here
相关文章：