我正在尝试(在本地)运行 AngularJS 中的第三个示例 http://angularjs.org/new称为“Wire up a Backend”，运气不好(在 Chrome 上)。
它提示:
Uncaught Error: [$injector:modulerr]
http://errors.angularjs.org/1.2.6/$injector/modulerr?p0=project&p1=Error%3A…
oogleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.6%2Fangular.min.js%3A29%3A56) angular.js:3577
这是 HTML/JS 文件:
index.html:
<!doctype html>
<html ng-app="project">
<head>
<script
src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular-
route.js"></script>
<script
src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.js">
</script>
<script
src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular-
resource.min.js">
</script>
<script src="https://cdn.firebase.com/v0/firebase.js"></script>
<script
src="https://cdn.firebase.com/libs/angularfire/0.5.0/angularfire.min.js">
</script>
<script src="project.js"></script>
</head>
<body>
<h2>JavaScript Projects</h2>
<div ng-view></div>
</body>
</html>
project.js
angular.module('project', ['ngRoute', 'firebase'])
.value('fbURL', 'https://angularjs-projects.firebaseio.com/')
.factory('Projects', function($firebase, fbURL) {
return $firebase(new Firebase(fbURL));
})
.config(function($routeProvider) {
$routeProvider
.when('/', {
controller:'ListCtrl',
templateUrl:'list.html'
})
.when('/edit/:projectId', {
controller:'EditCtrl',
templateUrl:'detail.html'
})
.when('/new', {
controller:'CreateCtrl',
templateUrl:'detail.html'
})
.otherwise({
redirectTo:'/'
});
})
.controller('ListCtrl', function($scope, Projects) {
$scope.projects = Projects;
})
.controller('CreateCtrl', function($scope, $location, $timeout, Projects) {
$scope.save = function() {
Projects.$add($scope.project, function() {
$timeout(function() { $location.path('/'); });
});
};
})
.controller('EditCtrl',
function($scope, $location, $routeParams, $firebase, fbURL) {
var projectUrl = fbURL + $routeParams.projectId;
$scope.project = $firebase(new Firebase(projectUrl));
$scope.destroy = function() {
$scope.project.$remove();
$location.path('/');
};
$scope.save = function() {
$scope.project.$save();
$location.path('/');
};
});
list.html
<input type="text" ng-model="search" class="search-query"
placeholder="Search">
<table>
<thead>
<tr>
<th>Project</th>
<th>Description</th>
<th><a href="#/new"><i class="icon-plus-sign"></i></a></th>
</tr>
</thead>
<tbody>
<tr ng-repeat="project in projects | orderByPriority | filter:search |
orderBy:'name'">
<td><a href="{{project.site}}" target="_blank">{{project.name}}</a>
</td>
<td>{{project.description}}</td>
<td>
<a href="#/edit/{{project.$id}}"><i class="icon-pencil"></i></a>
</td>
</tr>
</tbody>
</table>
details.html
<form name="myForm">
<div class="control-group" ng-class="{error: myForm.name.$invalid}">
<label>Name</label>
<input type="text" name="name" ng-model="project.name" required>
<span ng-show="myForm.name.$error.required" class="help-inline">
Required</span>
</div>
<div class="control-group" ng-class="{error: myForm.site.$invalid}">
<label>Website</label>
<input type="url" name="site" ng-model="project.site" required>
<span ng-show="myForm.site.$error.required" class="help-inline">
Required</span>
<span ng-show="myForm.site.$error.url" class="help-inline">
Not a URL</span>
</div>
<label>Description</label>
<textarea name="description" ng-model="project.description"></textarea>
<br>
<a href="#/" class="btn">Cancel</a>
<button ng-click="save()" ng-disabled="myForm.$invalid"
class="btn btn-primary">Save</button>
<button ng-click="destroy()"
ng-show="project.$remove" class="btn btn-danger">Delete</button>
</form>
我错过了什么吗？
顺便说一句，我阅读了与此问题相关的其他帖子，例如:AngularFire beginner doesn't work example "Wire up a Backend" from angularjs.org (solved-no css ref., chrome issue duplicated)但这是较旧的 angularJS 版本和不同的错误，显然缺少 bootstrap css
最佳答案
如果我点击异常中的链接，我会收到此消息:
In AngularJS 1.2.0 and later, ngRoute has been moved to its own module. If you are getting this error after upgrading to 1.2.x, be sure that you've installed ngRoute.
我只需要将 angular-route.min.js 添加到 index.html 的 head 中，一切似乎都正常预期:
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular-route.min.js"></script>
如果有帮助，请告诉我!
编辑
这是我的 head 的 index.html
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular-route.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular-resource.min.js"></script>
<script src="https://cdn.firebase.com/v0/firebase.js"></script>
<script src="https://cdn.firebase.com/libs/angularfire/0.5.0/angularfire.min.js"></script>
<script src="project.js"></script>
</head>
除此之外，我没有修改任何其他内容，所有源都是直接从您的链接下载的。
关于AngularJS "Wire up a Backend"示例仍然无法正常工作，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/20796993/