AngularJS 验证和承诺 [英] AngularJS validation and promises
问题描述
在 Angular 应用中,表单在提交之前通过自定义 JS 函数进行验证.根据条件,我需要向用户显示一个确认对话框,等待确认或拒绝,然后进行验证.我在异步实现这一点时遇到了困难.我相信我没有正确使用承诺,但不确定需要更新什么.
In an Angular app, form is validated via custom JS function before submitting. Based on a condition, I need to show a confirmation dialog to the user, wait for confirmation or rejection, then proceed with validation. I'm having difficulties with achieving this asynchronously. I believe I am not using the promise correctly, but not sure what needs to be updated.
工厂
app.factory("confirmDialogService", ['$q', 'ngDialog',
function ($q, ngDialog ) {
return {
popConfirm: function () {
var deferred = $q.defer();
var confirmed;
setTimeout(function () {
ngDialog.openConfirm({
template: 'template/confirmDialog.html',
className: 'ngdialog-theme-default'
}).then(function (value) {
console.log('Modal promise resolved. Value: ', value);
deferred.resolve(confirmed = true);
}, function (reason) {
console.log('Modal promise rejected. Reason: ', reason);
deferred.reject(confirmed = false);
});
}, 1000);
return deferred.promise;
}
};
}]);
控制器
$scope.checkSomething = function (){
if(needsConfirmation)
{
console.log('about to pop confirm');
confirmationService.popConfirm().then(function(confirmed){
console.log( 'from popConfirm() ' + confirmed + ''); // never logged
return confirmed;
}, function(){
// something went wrong
return false;
});
}
else
return true;
}
显示确认对话框,但在对话框中单击是或否不会产生预期的结果.
The confirmation dialog is shown, but clicking yes or no in the dialog does not produce results as expected.
我希望能够做的是根据用户是确认还是关闭对话框来获得真/假值,沿着
What I'd like to be able to do is get a true/false value depending whether a user confirmed or dismissed the dialog, along the lines of
var canProceed = $scope.checkSomething();
我想我需要把它包装成另一个承诺,但不确定如何.任何帮助将不胜感激.
I think I need to wrap this into another promise but not sure how. Any help will be greatly appreciated.
谢谢,
推荐答案
既然 openConfirm
已经返回了一个 Promise,你不需要再用 $q.defer() 创建一个代码>:
Since openConfirm
already returns a Promise, you don't need to create one more with $q.defer()
:
app.factory("confirmDialogService", ['$q', 'ngDialog', function ($q, ngDialog) {
return {
popConfirm: function () {
return ngDialog.openConfirm({
template: 'template/confirmDialog.html',
className: 'ngdialog-theme-default'
}).then(function (value) {
console.log('Modal promise resolved. Value: ', value);
return true;
}, function (reason) {
console.log('Modal promise rejected. Reason: ', reason);
return false;
});
}
};
}]);
之后 checkSomething
会这样使用它:
After that checkSomething
would use it this way:
$scope.checkSomething = function () {
if (needsConfirmation) {
return confirmationService.popConfirm().then(function (confirmed) {
return confirmed;
}, function () {
return false;
});
} else {
return $q.when(true);
}
}
注意它如何不再返回 true
或 false
,而是返回一个 promise 对象.最后,你应该使用 $scope.checkSomething()
像异步操作和 promise 一样:
Note how it no longer returns true
or false
, but rather a promise object. Finally you should use $scope.checkSomething()
like asynchronous operation with promises:
$scope.checkSomething().then(function() {
// ok, proceed
}, function() {
// something failed
});
总而言之,最重要的是要理解 checkSomething
应该返回一个 promise 而不仅仅是 true/false.
Summarizing, the most important thing to understand it that checkSomething
should return a promise and not just true/false.
这篇关于AngularJS 验证和承诺的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!