Angular $q 返回已解决的承诺
Angular $q returning resolved promise
我有一个变量 this.eligible
,我想将其分配给返回的 promise 的值,而不是实际的 promise 对象。
用户服务
this.eligible = this.sweepstakesService.checkUser(data);
抽奖服务
checkUser({profileId}) {
var deferred = this.$q.defer();
var id = profileId.replace(/[{}]/g, "");
this.$q.when(this.getGuid(id)
.then(guid => this.determineEligibility(guid))
.catch(this.handleError))
.then(function(data){
deferred.resolve(data);
});
return deferred.promise;
}
getGuid(profileId){
return this.resourcesService.guid.save({id:profileId}).$promise.then(data => data.guid);
}
determineEligibility(response){
return this.resourcesService.eligibility.save({id:response}).$promise.then(data => data.isEligible);
}
handleError(response){
console.log(response);
}
目前我正在返回 Promise{$$state: Object}
而不是实际解析的值。
为了访问 promise 的结果,您需要提供对 promise 对象的 then
方法的回调,该方法将在结果可用时立即被异步调用。
this.sweepstakesService.checkUser(data)
.then(function(value){
this.eligible = value;
});
当你使用 promise 时,你正在执行一些异步请求,所以你必须按顺序传递一些 callback 函数检索您的数据,并等待它。
您可以使用来自延迟 API.
的 $q.defer() 承诺管理器
$q.defer() 得到 2 个方法 :
resolve(value)
:通过给她最终值
来解决我们相关的承诺
reject(reason)
:解决了承诺错误。
不要忘记您正在做一些异步工作...
此外,一个很好的提示是将当前上下文保存到一个变量中,以便绑定您的数据。
控制器
(function(){
function Controller($scope, Service) {
//Save the current context of our controller
var self = this;
self.success = '';
self.fail = '';
//Declare our promise
var promise1 = Service.get(2);
var promise2 = Service.get(6);
promise1.then(function(response){
//Retrieve our response and set it to our success variable
//We use self as our Controller context
self.success = response;
}).catch(function(error){
self.success = error;
});
promise2.then(function(response){
self.fail = response;
}).catch(function(error){
//Retrieve our error and set it to our fail variable
self.fail = error;
});
}
angular
.module('app', [])
.controller('ctrl', Controller);
})();
服务
(function(){
function Service($http, $q) {
function get(n){
//using $q.defer() from deferred API
var defer = $q.defer();
//Simulate latency
setTimeout(function(){
n < 3
? defer.resolve(n)
: defer.reject('Error');
}, 1500);
//Return our promise
return defer.promise;
}
return {
get: get
}
}
angular
.module('app')
.factory('Service', Service);
})();
然后,您可以使用 controllerAs 语法实例化您的控制器。
HTML
<body ng-app='app' ng-controller='ctrl as self'>
<div>Success : {{self.success}}</div>
<div>Fail : {{self.fail}}</div>
</body>
你可以看到一个关于这个的例子Working Plunker
我有一个变量 this.eligible
,我想将其分配给返回的 promise 的值,而不是实际的 promise 对象。
用户服务
this.eligible = this.sweepstakesService.checkUser(data);
抽奖服务
checkUser({profileId}) {
var deferred = this.$q.defer();
var id = profileId.replace(/[{}]/g, "");
this.$q.when(this.getGuid(id)
.then(guid => this.determineEligibility(guid))
.catch(this.handleError))
.then(function(data){
deferred.resolve(data);
});
return deferred.promise;
}
getGuid(profileId){
return this.resourcesService.guid.save({id:profileId}).$promise.then(data => data.guid);
}
determineEligibility(response){
return this.resourcesService.eligibility.save({id:response}).$promise.then(data => data.isEligible);
}
handleError(response){
console.log(response);
}
目前我正在返回 Promise{$$state: Object}
而不是实际解析的值。
为了访问 promise 的结果,您需要提供对 promise 对象的 then
方法的回调,该方法将在结果可用时立即被异步调用。
this.sweepstakesService.checkUser(data)
.then(function(value){
this.eligible = value;
});
当你使用 promise 时,你正在执行一些异步请求,所以你必须按顺序传递一些 callback 函数检索您的数据,并等待它。
您可以使用来自延迟 API.
的 $q.defer() 承诺管理器$q.defer() 得到 2 个方法 :
resolve(value)
:通过给她最终值 来解决我们相关的承诺
reject(reason)
:解决了承诺错误。
不要忘记您正在做一些异步工作...
此外,一个很好的提示是将当前上下文保存到一个变量中,以便绑定您的数据。
控制器
(function(){
function Controller($scope, Service) {
//Save the current context of our controller
var self = this;
self.success = '';
self.fail = '';
//Declare our promise
var promise1 = Service.get(2);
var promise2 = Service.get(6);
promise1.then(function(response){
//Retrieve our response and set it to our success variable
//We use self as our Controller context
self.success = response;
}).catch(function(error){
self.success = error;
});
promise2.then(function(response){
self.fail = response;
}).catch(function(error){
//Retrieve our error and set it to our fail variable
self.fail = error;
});
}
angular
.module('app', [])
.controller('ctrl', Controller);
})();
服务
(function(){
function Service($http, $q) {
function get(n){
//using $q.defer() from deferred API
var defer = $q.defer();
//Simulate latency
setTimeout(function(){
n < 3
? defer.resolve(n)
: defer.reject('Error');
}, 1500);
//Return our promise
return defer.promise;
}
return {
get: get
}
}
angular
.module('app')
.factory('Service', Service);
})();
然后,您可以使用 controllerAs 语法实例化您的控制器。
HTML
<body ng-app='app' ng-controller='ctrl as self'>
<div>Success : {{self.success}}</div>
<div>Fail : {{self.fail}}</div>
</body>
你可以看到一个关于这个的例子Working Plunker