我想从Service函数返回数据,并通过routeProvider将其注入到控制器中,但只有在数据完全加载后才能返回。
app.js:
.when('/sources', {
templateUrl: 'views/app/source/inventory.html',
controller: 'InventoryCtrl',
pageTitle: 'Data Inventory',
resolve: {
orders: function (OrderService) {
return OrderService.getOrders();
},
sources: function (SourceService) {
return SourceService.getSources();
}
}
})
SourceService:
angular.module('wp.source')
.factory('SourceService', function ($http, $q) {
return {
getSources: function () {
var model = {
sources: []
};
var promises = [];
return $http.get('datasets/project.json')
.then(function (data) {
if(localStorage['files'] != null) {
var files = JSON.parse(localStorage['files']);
for (var i = 0; i < files.length; i++) {
model.sources.push(files[i]);
}
}
var sources = [];
for (var sourceId in data.data.sources) {
var source = data.data.sources[sourceId];
source.id = sourceId;
sources.push(source);
}
angular.forEach(sources, function (source) {
promises.push($http.get('datasets/' + source.filename).then(function (datasource, resolve) {
var metadata = datasource.data.metadata;
var source = {
name: metadata.name,
address: metadata.url,
frequency: metadata.refresh,
type: metadata.type,
tags: metadata.tags,
size: metadata.size,
active: source.active,
sourceID: source.id,
sourceFile: source.filename
};
return source;
}));
});
//var finalPromise = sources.reduce(function (promise, source, index, array) {
// return promise.then(function (a) {
// var query = $http.get('datasets/' + source.filename)
// .then(function (datasource) {
// var metadata = datasource.data.metadata;
// model.sources.push({
// name: metadata.name,
// address: metadata.url,
// frequency: metadata.refresh,
// type: metadata.type,
// tags: metadata.tags,
// size: metadata.size,
// active: source.active,
// sourceID: source.id,
// sourceFile: source.filename
// });
// });
// });
//}, $q.when([]));
//
//finalPromise.finally(function () {
// return model;
//})
$q.all(function () {
return model;
});
});
}
}
});
控制器:
angular.module('wp.source')
.controller('InventoryCtrl', function ($scope, orders, sources) {
$scope.orders = orders.data;
$scope.gridView = true;
$scope.rowView = false;
$scope.allSources = sources.sources;
$scope.shownSources = $scope.allSources;
...
目前我有一个问题,即在"模型"完全加载之前注入值。我试图将子查询打包到$q中。所有的承诺,但我不知道从那里到底去哪里
如有任何帮助,不胜感激
您想使用$q.defer()并返回延迟的承诺对象。您的代码将看起来像这样:
angular.module('wp.source')
.factory('SourceService', function ($http, $q) {
return {
getSources: function () {
var model = {
sources: []
};
var deffered = $q.defer();
var promises = [];
return $http.get('datasets/project.json')
.then(function (data) {
if(localStorage['files'] != null) {
var files = JSON.parse(localStorage['files']);
for (var i = 0; i < files.length; i++) {
model.sources.push(files[i]);
}
}
var sources = [];
for (var sourceId in data.data.sources) {
var source = data.data.sources[sourceId];
source.id = sourceId;
sources.push(source);
}
angular.forEach(sources, function (source) {
promises.push($http.get('datasets/' + source.filename).then(function (datasource, resolve) {
var metadata = datasource.data.metadata;
var source = {
name: metadata.name,
address: metadata.url,
frequency: metadata.refresh,
type: metadata.type,
tags: metadata.tags,
size: metadata.size,
active: source.active,
sourceID: source.id,
sourceFile: source.filename
};
return source;
}));
});
//var finalPromise = sources.reduce(function (promise, source, index, array) {
// return promise.then(function (a) {
// var query = $http.get('datasets/' + source.filename)
// .then(function (datasource) {
// var metadata = datasource.data.metadata;
// model.sources.push({
// name: metadata.name,
// address: metadata.url,
// frequency: metadata.refresh,
// type: metadata.type,
// tags: metadata.tags,
// size: metadata.size,
// active: source.active,
// sourceID: source.id,
// sourceFile: source.filename
// });
// });
// });
//}, $q.when([]));
//
//finalPromise.finally(function () {
// return model;
//})
$q.all(promises).then(function () {
deferred.resolve(model);
});
});
}
return deferred.promise();
}
});
EDIT正如其他人提到的,您需要将您的承诺数组传递给$q。都是为了让这一切顺利进行。同样值得注意的是,$q。所有这些都将返回一个数组,其中包含每个承诺的结果,按照它们在承诺数组中的顺序。
下面是一个演示defer用法的柱塞。
有更多的$q.defer和$q。
您需要使用$q.all
与承诺数组,并从外部承诺返回它:
angular.module('wp.source')
.factory('SourceService', function($http, $q) {
return {
getSources: function() {
var model = {
sources: []
};
return $http.get('datasets/project.json').then(function(data) {
if (localStorage['files'] != null) {
var files = JSON.parse(localStorage['files']);
for (var i = 0; i < files.length; i++) {
model.sources.push(files[i]);
}
}
var sources = [],
promises = [];
for (var sourceId in data.data.sources) {
var source = data.data.sources[sourceId];
source.id = sourceId;
sources.push(source);
}
var promises = sources.map(function(source) {
return $http.get('datasets/' + source.filename).then(function(datasource, resolve) {
var metadata = datasource.data.metadata;
model.sources.push({
name: metadata.name,
address: metadata.url,
frequency: metadata.refresh,
type: metadata.type,
tags: metadata.tags,
size: metadata.size,
active: source.active,
sourceID: source.id,
sourceFile: source.filename
});
});
});
return $q.all(promises).then(function() {
return model;
});
});
}
}
});
您没有正确使用$q.all
。修改代码最简单的方法就是修改
$q.all(function () {
return model;
});
$q.all(promises).then(function() {
return model;
});
你基本上没有"告诉"$q.all
承诺它需要聚合。请参考$q的文档,并检查all
如何工作。