reload page in angular js after logout

Question

Hi guys am a beginner in mean stack development I have tried to refresh the page after logout.I have tried location.reload(); but it doesn't work tell me the possible code for page reload in this scenario

$rootScope.$on('$routeChangeStart', function (event) {
    var storage = userService.isLoggedIn();
    console.log(storage);

    if (!storage) {
        console.log('DENY');
        $rootScope.adminlogin = "adminlogin";
        console.log($rootScope.adminlogin);

        $location.path('/login');
        $route.reload();      
       // $state.go('/login', null, {reload: true});
    }
    else {
        console.log('ALLOW');
        $rootScope.admindashboard = "admindashboard";
         var path = $location.path();
          console.log(path);
          console.log(storage);
         if(path == '/login'){
            $location.path('/');
         }


    }
});

`$state.go('/login', null, {reload: true})` line won't work ??? — Sachila Ranawaka, Mar 18 '17 at 13:02
Use `$window.location.reload()` [reload page](http://stackoverflow.com/questions/16703215/how-to-reload-or-re-render-the-entire-page-using-angularjs) — Gangadhar Jannu, Mar 18 '17 at 13:05
If you reload in the `$routeChangeStart` handler, you will create an infinite loop. That is probably what you meant when you said "it doesn't work". — georgeawg, Mar 18 '17 at 18:22

cnorthfield · Answer 1 · 2017-03-18T13:30:45.883

4

You should use $window.location.reload() from the the $window service if you want to refresh the page. It does the same thing as the reload button in your browser.

The reason you should use the $window service instead of directly accessing the native window object as per the AngularJS documentation:

While window is globally available in JavaScript, it causes testability problems, because it is a global variable. In AngularJS we always refer to it through the $window service, so it may be overridden, removed or mocked for testing.

On a side note as you stated you are using the $route service, just calling $route.reload() will only reload your controllers and not your entire application.

edited Mar 18 '17 at 13:30

answered Mar 18 '17 at 13:07

cnorthfield

3,384
15
22

can you tell me where could place it.I have placed it in controller when i call login page it again again reloading – vimal kumar Mar 18 '17 at 13:19
You can place it wherever you want as long as the `$window` service is made available. I'm sorry, I've told you _how_ to refresh the page, but it's up to you to know _when_ you want to refresh the page and _where_ you want to place the code to do so, you should know that :) – cnorthfield Mar 18 '17 at 13:24

Johnsons Gaming · Accepted Answer · 2017-03-18T23:07:45.563

0

All you need to do is this little line of Vanilia JS: document.location.href=document.location.href

EDIT: why is this getting downvoted?

edited Mar 18 '17 at 23:07

answered Mar 18 '17 at 17:16

Johnsons Gaming

101
4

score 0 · Answer 3 · answered Mar 18 '17 at 18:40

if you are using routes, then on click of Logout just route it to your login page.

Snap shot from demo:

these are my routes:

$routeProvider
        .when('/login', {
            controller: 'LoginController',
            templateUrl: 'modules/authentication/views/login.html',
            hideMenus: true
        })

        .when('/', {
            controller: 'HomeController',
            templateUrl: 'modules/home/views/home.html'
        })

        .otherwise({ redirectTo: '/login' });

and when i click on 'Logout' on my page it should do somehting like:

<p><a href="#/login">Logout</a></a></p>

it should redirect to login page as per routes.

reload page in angular js after logout

3 Answers3