angularjs > router resolve > "Error: [$injector:unpr] Unknown provider"
angularjs > router resolve > "Error: [$injector:unpr] Unknown provider"
我正在尝试将 resolve\promise 添加到我的项目中,因此当您请求页面时,它只会在从服务器收到 json 后加载。
这是我的 js 代码:
'use strict';
angular.module('myApp.show', ['ngRoute'])
.config(['$routeProvider', function ($routeProvider) {
$routeProvider.when('/show', {
templateUrl: 'views/show.html',
controller: 'showCtrl',
resolve: {
booksList: function ($http) {
return ($http.get('data/books.json')
.then(function (data) {
return data;
}));
}
}
});
}])
.controller('showCtrl', ['booksList', '$scope', function (booksList, $scope) {
$scope.books = booksList;
$scope.removeRow = function (productIndex) {
if (window.confirm("are you sure?")) {
$scope.books.splice(productIndex, 1);
}
}
}])
但这就是我得到的:
错误:[$injector:unpr] 未知提供者:booksListProvider <- booksList <- showCtrl
我对 angular 有点陌生,但我遵循了几个教程,虽然它在视频中有效 - 但我不断收到错误。
html:
<div class="table-responsive">
<div ng-app="myApp.show" ng-controller="showCtrl"> <!-- ctrl -->
<table st-table="rowCollection" class="table table-striped">
<thead>
<tr>
<th st-sort="author">Author</th>
<th st-sort="date">Date</th>
<th st-sort="title">Title</th>
<th></th>
</tr>
</thead>
<tbody>
<tr ng-repeat="(bookIndex, book) in books">
<td class="col-md-3">{{ book.author }}</td>
<td class="col-md-3">{{ book.date | date }}</td>
<td class="col-md-4">{{ book.title | beutifyTitle }}</td>
<td class="col-md-1"><ng-include src="'views/partials/editBook.html'"></ng-include></td>
<td class="col-md-1"><button class="btn btn-warning" ng-click="removeRow()">Delete</button></td>
</tr>
</tbody>
</table>
</div>
</div
您应该从模板中删除 ng-controller="showCtrl"
。原因是,您已经在通过路由器访问 showCtrl
。但是当你再次写 ng-controller
over inline template 在这种情况下它无法获得 booksList
resolve provider.
我正在尝试将 resolve\promise 添加到我的项目中,因此当您请求页面时,它只会在从服务器收到 json 后加载。 这是我的 js 代码:
'use strict';
angular.module('myApp.show', ['ngRoute'])
.config(['$routeProvider', function ($routeProvider) {
$routeProvider.when('/show', {
templateUrl: 'views/show.html',
controller: 'showCtrl',
resolve: {
booksList: function ($http) {
return ($http.get('data/books.json')
.then(function (data) {
return data;
}));
}
}
});
}])
.controller('showCtrl', ['booksList', '$scope', function (booksList, $scope) {
$scope.books = booksList;
$scope.removeRow = function (productIndex) {
if (window.confirm("are you sure?")) {
$scope.books.splice(productIndex, 1);
}
}
}])
但这就是我得到的: 错误:[$injector:unpr] 未知提供者:booksListProvider <- booksList <- showCtrl
我对 angular 有点陌生,但我遵循了几个教程,虽然它在视频中有效 - 但我不断收到错误。
html:
<div class="table-responsive">
<div ng-app="myApp.show" ng-controller="showCtrl"> <!-- ctrl -->
<table st-table="rowCollection" class="table table-striped">
<thead>
<tr>
<th st-sort="author">Author</th>
<th st-sort="date">Date</th>
<th st-sort="title">Title</th>
<th></th>
</tr>
</thead>
<tbody>
<tr ng-repeat="(bookIndex, book) in books">
<td class="col-md-3">{{ book.author }}</td>
<td class="col-md-3">{{ book.date | date }}</td>
<td class="col-md-4">{{ book.title | beutifyTitle }}</td>
<td class="col-md-1"><ng-include src="'views/partials/editBook.html'"></ng-include></td>
<td class="col-md-1"><button class="btn btn-warning" ng-click="removeRow()">Delete</button></td>
</tr>
</tbody>
</table>
</div>
</div
您应该从模板中删除 ng-controller="showCtrl"
。原因是,您已经在通过路由器访问 showCtrl
。但是当你再次写 ng-controller
over inline template 在这种情况下它无法获得 booksList
resolve provider.