AngularJS 中的未知资源提供者
Unknown resource provider in AngularJS
我正在使用 Yeomen 的脚手架创建一个 angular 应用程序。我想从我的 REST 服务发送和获取数据,但资源提供程序有问题。
我有一个简单的控制器:
angular.module('fronterApp')
.controller('ClubCtrl', function ($scope, ClubService) {
$scope.find = function(){
$scope.club = ClubService.find();
};
});
服务:
var app = angular.module('fronterApp');
app.service('ClubService', function (ClubResource) {
var find = function(){
return ClubResource.find({id: 1});
};
return{
find: find
};
});
我的资源提供者:
var app = angular.module('fronterApp', ['ngResource', 'ngRoute']);
var server = 'http://localhost:8080';
app.run(function($http) {
$http.defaults.headers.common['Content-Type'] = 'application/x-www-form-urlencoded';
$http.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
});
app.factory('ClubResource', function($resource) {
return $resource(server + '/api/clubs/:id', {id: '@id'});
});
现在我想在控制器中获取数据,使用使用提供程序的服务。但是在 运行 应用程序之后,js 控制台显示:
Error: [$injector:unpr] Unknown provider: ClubResourceProvider <- ClubResource <- ClubService
我已将<script src="bower_components/angular-resource/angular-resource.js"></script>
添加到index.html,我尝试在服务中使用['ngResource']
,但没有任何效果。此外,如果我添加 ['ngResource']
我不会在控制台中收到此错误,但不会显示 club.html 中的 html (html 仅显示来自服务器的项目)。我的意思是,没有加载任何视图。
我不知道,为什么我的服务不能在这里注入资源提供者。
更新:
现在,我将服务更改为:
angular.module('fronterApp')
.service('ClubService', function (ClubResource) {
var get = function () {
return ClubResource.get({id: 1});
};
return {
get: get
};
});
和资源到(但GET是默认的,所以我认为这是不必要的):
var app = angular.module('fronterApp');
var server = 'http://localhost:8080';
app.run(function ($http) {
$http.defaults.headers.common['Content-Type'] = 'application/x-www-form-urlencoded';
$http.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
});
app.factory('ClubResource', function ($resource) {
return $resource(server + '/api/clubs/:id', {id: '@id'}, {
get: {
method: 'GET'
}
});
});
好的,我已经解决了这个问题...
我很笨,因为我在其他文件中有我的工厂,名为routing.js
var app = angular.module('fronterApp');
var server = 'http://localhost:8080';
app.factory('ClubResource', ['$resource', function ($resource) {
return $resource(server + '/api/clubs/:id', {id: '@_id'}, {
});
}]);
而且我还没有将这个文件添加到 index.html,所以我得到了这个错误,因为 Angular 找不到包含所需代码的脚本。
现在一切正常。
我正在使用 Yeomen 的脚手架创建一个 angular 应用程序。我想从我的 REST 服务发送和获取数据,但资源提供程序有问题。
我有一个简单的控制器:
angular.module('fronterApp')
.controller('ClubCtrl', function ($scope, ClubService) {
$scope.find = function(){
$scope.club = ClubService.find();
};
});
服务:
var app = angular.module('fronterApp');
app.service('ClubService', function (ClubResource) {
var find = function(){
return ClubResource.find({id: 1});
};
return{
find: find
};
});
我的资源提供者:
var app = angular.module('fronterApp', ['ngResource', 'ngRoute']);
var server = 'http://localhost:8080';
app.run(function($http) {
$http.defaults.headers.common['Content-Type'] = 'application/x-www-form-urlencoded';
$http.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
});
app.factory('ClubResource', function($resource) {
return $resource(server + '/api/clubs/:id', {id: '@id'});
});
现在我想在控制器中获取数据,使用使用提供程序的服务。但是在 运行 应用程序之后,js 控制台显示:
Error: [$injector:unpr] Unknown provider: ClubResourceProvider <- ClubResource <- ClubService
我已将<script src="bower_components/angular-resource/angular-resource.js"></script>
添加到index.html,我尝试在服务中使用['ngResource']
,但没有任何效果。此外,如果我添加 ['ngResource']
我不会在控制台中收到此错误,但不会显示 club.html 中的 html (html 仅显示来自服务器的项目)。我的意思是,没有加载任何视图。
我不知道,为什么我的服务不能在这里注入资源提供者。
更新: 现在,我将服务更改为:
angular.module('fronterApp')
.service('ClubService', function (ClubResource) {
var get = function () {
return ClubResource.get({id: 1});
};
return {
get: get
};
});
和资源到(但GET是默认的,所以我认为这是不必要的):
var app = angular.module('fronterApp');
var server = 'http://localhost:8080';
app.run(function ($http) {
$http.defaults.headers.common['Content-Type'] = 'application/x-www-form-urlencoded';
$http.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
});
app.factory('ClubResource', function ($resource) {
return $resource(server + '/api/clubs/:id', {id: '@id'}, {
get: {
method: 'GET'
}
});
});
好的,我已经解决了这个问题... 我很笨,因为我在其他文件中有我的工厂,名为routing.js
var app = angular.module('fronterApp');
var server = 'http://localhost:8080';
app.factory('ClubResource', ['$resource', function ($resource) {
return $resource(server + '/api/clubs/:id', {id: '@_id'}, {
});
}]);
而且我还没有将这个文件添加到 index.html,所以我得到了这个错误,因为 Angular 找不到包含所需代码的脚本。 现在一切正常。