angularjs - angular ui-router logout state doesn't redirect to login until refresh the page -

what need on click on logout link ,

we call logout method of authservice clear cookie data , user should redirected on login page.

but seem's not working. page being stay on /logout page , user need refresh page goes /login page. why so?

here relevant code

.state("logout", {           url: '/logout',           data: {               requiresauth: true           },           controller:['$state', 'authservice', function($state, authservice) {                       authservice.logout();                       $state.transitionto('login', null, { reload :true});            }]       }) 

and here relevant authservice method

app.factory('authservice', function($log, $http, $q, $cookies){  authservice.logout = function () {         var deferred = $q.defer();         $http({           method: "get",           url: '/app/logout.json'         }).then(function(result) {           $cookies.remove('currentuser');           deferred.resolve(result);         }, function(error) {           deferred.reject(error);         });         return deferred.promise;     }; }); 

note : when write /logout in url , hit goes login page.

is factory code complete posted? if yes, afraid have syntax error. because authservice undefined.

you have first declare authservice object, , return object in factory function. else, authservice service go haywire when injected.

app.factory('authservice', ['$log', '$http', '$q', '$cookies', function($log, $http, $q, $cookies) {   //declare authservice variable first, object.   var authservice = {};   //now declaring method inside object,named logout   authservice.logout = function() {     var deferred = $q.defer();     $http({       method: "get",       url: 'logout.json'     }).then(function(result) {       $cookies.remove('currentuser');       deferred.resolve(result);     }, function(error) {       deferred.reject(error);     });     return deferred.promise;   };   //remember return object can used service   return authservice; }]) 

i have pretty mocked example closely , relevant code. works fine. here plnkr.

one gentle reminder though: @ controller of logout state, want $state.transitionto after authservice has been resolved. this:

authservice.logout().then(function() {   $state.transitionto('login', null, {     reload: true   }); },function(){   //handle error here }) 

i did not change in plnkr, since app , should clear achieving.