用 promise 装饰器包装 $http 调用
Wrapping $http call with promise decorator
我有一个 angular 服务用于与我的后端通信,如下所示:
getMyBooks: function(userId) {
var deferred = $q.defer();
$http.get('/api/users/' + userId + '/books')
.success(function(data) {
deferred.resolve(data);
}).error(function(data) {
deferred.reject(data);
});
return deferred.promise;
},
然而,在这些函数的 6 个左右之后,代码开始变得笨拙。
所以我尝试使用装饰器模式重构它,从这里松散地复制加倍装饰器:http://javascript.info/tutorial/decorators
给我这个更新后的代码:
var bookService = function ($http, $q, $filter) {
var deferredwrapper = function(f) {
return function() {
var deferred = $q.defer();
f.apply(this, arguments)
.success(function(data) {
deferred.resolve(data);
}).error(function(data) {
deferred.reject(data);
});
return deferred.promise;
}
};
var funcs = {
getBooks: deferredwrapper(
function(userId) { $http.get('/api/users/' + userId + '/books') }
)
};
return {
getMyBooks: function() { funcs.getBooks }
}
};
然而,这只会导致大量错误并返回大量未定义的内容。我想我在应该调用它或其他东西时传递了一个函数,但我完全不知道如何使它工作
你让自己的生活变得太复杂了。只需使用承诺链接:
getMyBooks: function(userId) {
return $http.get('/api/users/' + userId + '/books').then(function(response) {
return response.data;
}).catch(function(response) {
return $q.reject(response.data);
});
}
也就是说,您的技术不起作用,因为您作为参数传递给 deferredwrapper() 的函数没有 return 任何东西。并且包装器期望函数 return 一个 HTTP 承诺。改变
function(userId) { $http.get('/api/users/' + userId + '/books') }
到
function(userId) { return $http.get('/api/users/' + userId + '/books'); }
您在 return 使用该服务时犯了同样的错误:您正在分配一个既不做也不 return 任何事情的功能给 getMyBooks
。改成
getMyBooks: funcs.getBooks
我有一个 angular 服务用于与我的后端通信,如下所示:
getMyBooks: function(userId) {
var deferred = $q.defer();
$http.get('/api/users/' + userId + '/books')
.success(function(data) {
deferred.resolve(data);
}).error(function(data) {
deferred.reject(data);
});
return deferred.promise;
},
然而,在这些函数的 6 个左右之后,代码开始变得笨拙。
所以我尝试使用装饰器模式重构它,从这里松散地复制加倍装饰器:http://javascript.info/tutorial/decorators
给我这个更新后的代码:
var bookService = function ($http, $q, $filter) {
var deferredwrapper = function(f) {
return function() {
var deferred = $q.defer();
f.apply(this, arguments)
.success(function(data) {
deferred.resolve(data);
}).error(function(data) {
deferred.reject(data);
});
return deferred.promise;
}
};
var funcs = {
getBooks: deferredwrapper(
function(userId) { $http.get('/api/users/' + userId + '/books') }
)
};
return {
getMyBooks: function() { funcs.getBooks }
}
};
然而,这只会导致大量错误并返回大量未定义的内容。我想我在应该调用它或其他东西时传递了一个函数,但我完全不知道如何使它工作
你让自己的生活变得太复杂了。只需使用承诺链接:
getMyBooks: function(userId) {
return $http.get('/api/users/' + userId + '/books').then(function(response) {
return response.data;
}).catch(function(response) {
return $q.reject(response.data);
});
}
也就是说,您的技术不起作用,因为您作为参数传递给 deferredwrapper() 的函数没有 return 任何东西。并且包装器期望函数 return 一个 HTTP 承诺。改变
function(userId) { $http.get('/api/users/' + userId + '/books') }
到
function(userId) { return $http.get('/api/users/' + userId + '/books'); }
您在 return 使用该服务时犯了同样的错误:您正在分配一个既不做也不 return 任何事情的功能给 getMyBooks
。改成
getMyBooks: funcs.getBooks