I have a login modal that opens up every time an unlogged user navigates to a page that requires login.
angular.module('petSpot', ['ionic', 'ngCordova', 'ngMaterial', 'ngMessages', 'ngTouch', 'ui.bootstrap', 'petSpot.controllers', 'petSpot.directives', 'petSpot.services'])
.run(function ($ionicPlatform, $cordovaStatusbar, $rootScope, $state, $ionicModal, Session, loginModal) {
$ionicPlatform.ready(function() {
//Build login modal
$ionicModal.fromTemplateUrl('templates/login.html', {
scope: $rootScope
}).then(function (modal) {
$rootScope.loginModal = modal;
});
$rootScope.$on('$stateChangeStart', function (event, toState, toParams) {
var requireLogin = toState.data.requireLogin;
if (requireLogin && typeof $rootScope.currentUser === 'undefined') {
event.preventDefault();
loginModal()
.then(function () {
return $state.go(toState.name, toParams);
})
.catch(function () {
// do nothing
});
}
});
})
I want that If the modal closes without the user logging in, a rejected promise will be returned and the navigation will not be approved. If the user successfuly logs in, I want the modal to close and to return a resolved promise.
This is my login modal service:
angular.module('petSpot.services')
.service('loginModal', function ($ionicModal, $rootScope, $q, $resource) {
function assignCurrentUser (user) {
$rootScope.currentUser = user;
return user;
}
return function () {
var defer = $q.defer();
$rootScope.loginModal.show().then(function () { // THIS IS NO GOOD
defer.resolve();
})
.catch(function () {
defer.reject(error);
});
return defer.promise;
};
});
Any help would be very appreciated!