问题
I have the following code:
.service('loginModal', function($rootScope, $uibModal) {
function updateUserData(user, data) {
Object.keys(data).forEach(function(key) {
user.facebook[key] = data[key];
});
return user.$update();
}
return function() {
var instance = $uibModal.open({
templateUrl: 'tpls/modals/login.html',
controller: function($scope, $uibModalInstance, facebookService, UserService) {
function updateUserData(user, data) {
Object.keys(data).forEach(function(key) {
user.facebook[key] = data[key];
});
return user.$update();
}
$scope.login = function() {
facebookService.login().then(function(response) {
var authResponse = facebookService.getAuthResponse();
facebookService.api('/me').then(function(response) {
if (response && !response.error) {
response.picture = 'http://graph.facebook.com/' + response.id + '/picture?type=large';
UserService.query({
'facebook.id': response.id,
'facebook.token': authResponse.accessToken
}).$promise.then(function(results) {
response.token = {
value: authResponse.accessToken,
expiresIn: authResponse.expiresIn
};
if (results.length > 0)
updateUserData(results[0], response) //THIS DOES NOT FULFILL OR REJECT
.then($uibModalInstance.close, $uibModalInstance.dismiss);
else
UserService.save({
facebook: response,
local: {
username: response.email || response.id,
password: response.token.value
}
}).$promise
.then($uibModalInstance.close, $uibModalInstance.dismiss);
}, $uibModalInstance.dismiss);
} else {
$uibModalInstance.dismiss(response.error || response);
}
}, $uibModalInstance.dismiss);
}, $uibModalInstance.dismiss);
};
}
instance.opened.then(function() {
$rootScope.openModals.push(instance);
});
function removeInstanceFromModalList() {
$rootScope.openModals.splice($rootScope.openModals.indexOf(instance), 1);
}
instance.result.then(removeInstanceFromModalList, removeInstanceFromModalList);
return instance.result;
}
Basically I'm calling loginModal().then(function(user){...},function(e){...});
from wherever I want.
The part which does not work however is right after I query UserService
if (results.length > 0)
updateUserData(results[0], response) //THIS DOES NOT FULFILL OR REJECT
.then($uibModalInstance.close, $uibModalInstance.dismiss);
I've also tried debugging like this:
updateUserData(results[0], response)
.then(function(usr) {
$uibModalInstance.close(usr); //debugger reaches this statement,
//nothing happens
}, function(e) {
$uibModalInstance.dismiss(e);
});
What's wrong with my code? only backdrop clicks seem to close the dialog.
回答1:
You can use the promise returned by $uibModal.open() which has the close() method attached. You could store it in the controller $scope:
$scope.modal_instance = $uibModal.open({ ...
and then use:
$scope.modal_instance.close();
instead of $uibModalInstance.close.
回答2:
Dangit - had a version issue.
Apperantly the version of angular-ui I was using was incompatible with angular#1.4.7 so I had to upgrade to 1.4.8.
来源:https://stackoverflow.com/questions/34487541/uibmodalinstance-close-not-working