我是Angular的新手,查找相关问题,但找不到任何有用的问题。我希望有人可以提供一些见识,因为我一整天都无济于事:我正在尝试使用解决方案来使用$ Resource和UI-Router进行应用来获取数据。问题在于,对服务方法的呼叫永远不会得到(呼叫是定义的,int eh Resolve属性'(,尽管状态似乎可以加载良好。(该州实际上具有UI网格,因此当前网格显示为空(。该应用程序正在使用JSON服务器目前提供数据,该服务器未显示任何HTTP请求。请在下面找到一些相关代码:国家提供商配置:
angular.module('carsApp', ['ui.router', 'ngResource', 'ui.bootstrap', 'ui.grid'])
.config(function($stateProvider, $urlRouterProvider) {
$stateProvider
// abstract state for 'car' state. Creates view template with two sub tabs.
.state('app.main.car', {
url: "",
abstract: true,
views: {
// the child template (Absolutely named)
'contentbar@app.main': {
templateUrl: 'views/crid.html',
controller: 'GridController'
},
'subTabs@app.main': {
templateUrl: 'views/cars.html',
controller: 'CarController'
}
},
resolve: {
// create an Object property called "cars"
// which will later be used for Dependency Injection
// inside our Controller. Inject any Services required to resolve the data
cars: ['gridFactory', function(gridFactory) {
// Return Service call, that returns a Promise
return gridFactory.getCars();
}],
dealer: function() {
return {};
}
}
})
.state('app.main.car.all', {
url: "car/summary",
views: {
'subTabView@app.main.car': {
templateUrl: 'views/summary.html'
}
},
resolve: {
cars: ['gridFactory', function(gridFactory) {
// Return Service call, that returns a Promise
return gridFactory.getCars();
}],
dealer: function() {
return {};
}
}
});
$urlRouterProvider.otherwise('/');
});
服务:
.service('gridFactory', ['$resource', 'baseURL', function($resource, baseURL) {
this.getCars = function() {
return $resource(baseURL + "cars", null, {
'query': {
method: 'GET',
isArray: true,
// im setting authroization header here so using this version
// of query to be able to add headers
}
});
}
}
控制器:
.controller('GridController', ['$scope', '$stateParams', '$state', 'gridFactory', 'cars', 'dealer', function($scope, $stateParams, $state, gridFactory, cars, dealer) {
$scope.cars = cars; //i am not sure if this is the correct way to assign. Looking up at
//all the blog posts i could, this is what i understood
$scope.dealer = dealer;
console.log('scope objects ' + JSON.stringify($scope.cars)); //$scope.cars is undefined here
//grid related code follows. Not shown here to keep things simple.
// the grid is apparently working as i was able to get data without using resolve.
// some context on why i want to use resolve:
// I want the grid to refresh whenever an entry on the grid is clicked, the corresponding details
// for that entry are fetched from gridFActory using resource and displayed in the grid again.
// However, the grid was not being refreshed ( i was using a child controller for a the .all state,
// i tried every trick on stackoverflow to make it work but giving 'resolve' a go as a final attempt)
}
我希望有人可以就我所缺少的东西提供一些见解。非常感谢您的时间!
需要调用query()
方法并返回$resource
承诺。默认情况下,$资源方法返回请求完成后填充的空对象或数组
resolve: {
cars: ['gridFactory', function(gridFactory) {
// Return Service call, that returns a Promise
return gridFactory.getCars().query().$promise;
}],
dealer: ....
您还可以将此调用的一些调用转移到服务方法中,并返回Query((。$ Promise
demo
我想在您的工厂获取汽车方法中的问题:
尝试以下内容:
.service('gridFactory', ['$resource', 'baseURL', function($resource, baseURL) {
this.getCars = function() {
var cars = $resource(baseURL + "cars", null, {
'query': {
method: 'GET',
isArray: true,
// im setting authroization header here so using this version
// of query to be able to add headers
}
return new Promise(function(resolve, reject){
var result = [];
cars.query(function (response) {
angular.forEach(response, function (item) {
result.push(item);
}
}
resolve(result);
})
})
});
}
}
我认为这个问题与您有关