我有一个模块factoty做$ http呼叫名称:'containeData' 比我通过承诺将数据发送到其他工厂模块 名称: 'divLogicFactory'。我想发送对象数组“arraysOfDives” 到控制器。但是arraysOfDives是空的。 因为填充数组的方法是回调。 但我不知道回调完成后如何将对象返回控制器。请帮帮我。
var jsonFactory = angular.module('jsonFactory',[]);
jsonFactory.factory('containerData',function($http,$q){
var
defer = $q.defer(),
data = {};
data.getDivData = function(){
return $http({
method:"get",
url:"App/metaData/divData.json"
}).
then(function(response){
defer.resolve(response.data);
// return response.data;//defer.promise;
return defer.promise;
},function(error){
defer.reject(error);
return defer.promise;
})
}
var divLogic = angular.module('divLogic', ['jsonFactory']);
divLogic.factory('divLogicFactory', function (containerData, $q) {
var divLogicFactory = {};
divLogicFactory.arraysOfDives = [];
divLogicFactory.setDivsData = function () {
**this is the call back method**
containerData.getDivData().then(function (data) {
//extract divData from call back
for (var i = 0; i < data.length; i++) {
var
height = data[i].height,
width = data[i].width,
border = data[i].border,
positionY = data[i].positionTopY,
positionX = data[i].positionLeftX,
templateID = data[i].templateID;
init(height, width, border, positionY, positionX, templateID);
}
})
}
function init(height, width, border, positionY, positionX, templateID) {
var $div = $('<div id="templateID"></div>').css({
"height": height,
"width": width,
"border": border
});
divLogicFactory.arraysOfDives.push($div);
}
return divLogicFactory;
});
var controllers = angular.module('controllers', ['jsonFactory','contentItemDirective','divLogic']);
controllers.controller("HomeController", function ($http,$scope, containerData,divLogicFactory) {
console.log(divLogicFactory);
})]
答案 0 :(得分:-1)
快速回答
您应该从object
的{{1}}函数外部返回自定义承诺.then
,而不是返回data.getDivData
函数(但在处理$http
调用时创建开销承诺被视为反模式)。不要去$http
部分。
<强>代码强>
Quick answer
<强>详细强>
您未从代码的正确部分返回承诺。
除此之外,你已经创造了在那个地方不需要的开销承诺。当进行ajax调用时,data.getDivData = function(){
var defer = $q.defer(), data = {};
$http({
method:"get",
url:"App/metaData/divData.json"
}).
then(function(response){
defer.resolve(response.data);
},function(error){
defer.reject(error);
//return defer.promise; //removed from here
})
return defer.promise;
}
方法会返回一个promise对象。你可以利用这种方式。
$http
此外,您在data.getDivData = function(){
return $http.get('App/metaData/divData.json').then(function(response){
//used .then here because you could have control over a data here
//you validate some prevalidation stuff in data, which should be there
//before returning data. otherwise you could just return.
//exposing only part `response.data` to consumer, other part is abstracted.
return response.data;
},function(error){
return error;
});
//OR you could just do below as @EProgrammerNotFound suggested.
//return $http.get('App/metaData/divData.json')
};
方法中也有DOM操作代码,而这些代码不应该存在。如果将代码移到指令中会更好。
为了使用setDivsData
获取arraysOfDives
,您使用了promise链,以便在创建div之后,您将返回该arrayOfDives对象。
<强>工厂强>
setDivsData
<强>控制器强>
divLogicFactory.setDivsData = function () {
return containerData.getDivData().then(function (data) {
//extract divData from call back
for (var i = 0; i < data.length; i++) {
var
height = data[i].height,
width = data[i].width,
border = data[i].border,
positionY = data[i].positionTopY,
positionX = data[i].positionLeftX,
templateID = data[i].templateID;
init(height, width, border, positionY, positionX, templateID);
}
return divLogicFactory.arraysOfDives; //return arraysOfDives
});