簡體   English   中英

AngularJS:未捕獲錯誤:[$ injector:modulerr]

[英]AngularJS:Uncaught Error: [$injector:modulerr]

我正在嘗試在http://angularjs.org上給出一個名為Wire up a Backend的AngularJS示例。
我在我的機器上復制了代碼並保存了文件。
執行index.html時,
Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.2.13/$injector/modulerr?p0=project&p1=Error%3…gleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.13%2Fangular.min.js%3A17%3A431)
控制台上顯示錯誤。
任何幫助將不勝感激。
以下是代碼。

的index.html

<!doctype html>
<html ng-app="project">
<head>
 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular-resource.min.js">
</script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular-route.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>

detail.html

<form name="myForm">
<div class="control-group" ng-class="{error: myForm.name.$invalid &&   !myForm.name.$pristine}">
<label>Name</label>
<input type="text" name="name" ng-model="project.name" required>
<span ng-show="myForm.name.$error.required && !myForm.name.$pristine" class="help-inline">Required {{myForm.name.$pristine}}</span>
</div>
<div class="control-group" ng-class="{error: myForm.site.$invalid && !myForm.site.$pristine}">
<label>Website</label>
<input type="url" name="site" ng-model="project.site" required>
<span ng-show="myForm.site.$error.required && !myForm.name.$pristine" 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>

我認為你的$resource實例Project是錯誤的,它既沒有注入module('project', ['ngRoute', 'firebase'])也沒有創建.factory('Projects')

所以你需要......我認為如下:

angular.module('project', ['ngRoute', 'firebase'])
    .factory('Projects', function($resource) {
        return $resource('url:id',
        {
            id: "@id"
        });
    })  

或創建一個新模塊並包含在['ngRoute', 'firebase']

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM