我有以下控制器代码
module.registerController('DemoCtrl', function ($scope, myFactory) {
myFactory.get(function (data) {
console.log(data); /// data is always undefined
});
});
并跟随工厂调用restful webapi
module.registerFactory('myFactory', ['$http',
function ($http) {
function get(callback) {
$http.get('mywebapiurl')
.success(function (response) {
//debugger; data comes back from server
callback(response);
}).error(function (response, status, headers, config) {
callback(response);
});
}
return {
get: get
}
}]);
工厂正在调用webapi服务并确实获取数据。但是在控制器中数据不会被返回。
我错过了一些明显的东西吗?也不确定这是否是使用工厂在控制器中调用angularjs中的webservice的最佳方法。任何意见都是最受欢迎的。
谢谢,
答案 0 :(得分:1)
控制器代码
module.registerController('DemoCtrl', function ($scope, myFactory) {
myFactory.get("url").then(function(d) {
console.log(d.data);
}
});
});
正在调用restful webapi的工厂
module.registerFactory('myFactory', ['$http',
function ($http) {
var apiFactory = {
get:function(url){
return $http.get(url);
}
}
return apiFactory;
}]);
工厂成功与失败
module.registerFactory('myFactory', ['$http',
function ($http) {
var apiFactory = {
get:function(url){
return $http.get(url).then(function(response){
// success
return responce.data;
},function(error){
//failure
return error;
};
}
}
return apiFactory;
}]);
答案 1 :(得分:1)
您想要返回promise而不是传递回调。由于$http.get
已经返回一个promise,你可以返回它,或者直接返回响应数据的派生promise。顺便说一下,您的factory
看起来应该是service
而不是:
angular.moudule('yourApp')
.service('myService', ['$http', myService]);
function myService($http) {
this.get = function(url) {
return $http.get(url)
.then(function transformData(response){
return response.data;
}).catch(function onError(rejectionResponse){
//Whatever you want to do here
});
}
}
这种方式myService.get
会返回一个承诺,您可以.then()
,.catch()
和.finally()
保留您想要的内容,保持框架编码风格。例如:
var squirrels = [];
myService.get('http://squirrelshop.com/api/squirrels')
.then(function(squirrelsData){
console.log('Got the squirrels!');
squirrels = squirrelsData;
}).catch(function(rejection){
console.warn('Couldnt fetch squirrels. Reason: ' + rejection);
});