how to skip login page if user already logged in in ionic

Question

Hi i am new to ionic framework. i am using session manager in ionic. But i want to skip login page if user is already logged in.

app.js

angular.module('grocery', ['ionic', 'grocery.controller', 'ngCordova', 'ngCordovaOauth'])

.run(function($ionicPlatform, $cordovaSQLite, $cordovaToast, $rootScope, mainItemsList, $state) {
    $ionicPlatform.ready(function() {
        if (window.cordova && window.cordova.plugins.Keyboard) {

            cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);

            stops the viewport
            // from snapping when text inputs are focused. Ionic handles this internally for
            // a much nicer keyboard experience.
            cordova.plugins.Keyboard.disableScroll(true);
        }
        if (window.StatusBar) {
            StatusBar.styleDefault();
        }

    });


});


$rootScope.$on('$locationChangeStart', function(event, newUrl, oldUrl) {
    if (mainItemsList.isLoggedIn() != true) {
        $state.go('app.login');
    }



})


.config(function($stateProvider, $urlRouterProvider) {

    $stateProvider
        .state('app', {
            url: "/app",
            abstract: true,
            templateUrl: "templates/navigationDrawer.html",
            controller: 'AppCtrl'
        })

    .state('app.masterList', {
        url: "/masterList",
        views: {
            'menuContent': {
                templateUrl: "templates/masterList.html",
                controller: 'indexCtrl'
            }
        }
    })


    .state('app.login', {
        url: "/login",
        views: {
            'menuContent': {
                templateUrl: "templates/login.html",
                controller: 'loginCtrl'
            }
        }
    })

    .state('app.register', {
        url: "/register",
        views: {
            'menuContent': {
                templateUrl: "templates/register.html",
                controller: 'registerCtrl'
            }
        }
    })


    $urlRouterProvider.otherwise("/app/masterList");


});


angular.module('grocery.services', [])
    .factory('mainItemsList', function($cordovaSQLite, $cordovaToast, $cordovaPreferences) {
        return {
            isLoggedIn: function(sessionEmail) {

                $cordovaPreferences.store('email', sessionEmail).success(function(value) {
                        //$cordovaToast.showShortTop('stored');
                    })
                    .error(function(error) {
                        $cordovaToast.showShortTop("Error " + error);
                    })


                return true;
            }


        }
    })

I tried existing stackoverflow answers. But not working. please help me where i am wrong.

Answer 1

Create a new controller and a new state called autologin . Make this your default state. In the autologin controller, check whether the user is already logged in. If he is, redirect to some page. If he is not, redirect to login.

  .state('app.autologin', {
    url: "/autologin",
    controller: 'autologinCtrl'
  })

$urlRouterProvider.otherwise("/app/autologin");

controller:

angular.module('grocery').controller('autologinCtrl, function($scope, $state){
    //check if user is logged in
    if (userLoggedIn){
        state.go('app.masterList');
    } else {
        state.go('app.login');
    }
});

Answer 2

If you are adding a new controller for this logic,There will be a chance for flickering between the pages.So handle this by using $urlRouterProvider

.config(function($stateProvider, $urlRouterProvider, mainItemsList) {
    $stateProvider
        .state('app', {
            url: "/app",
            abstract: true,
            templateUrl: "templates/navigationDrawer.html",
            controller: 'AppCtrl'
        })

    .state('app.masterList', {
            url: "/masterList",
            views: {
                'menuContent': {
                    templateUrl: "templates/masterList.html",
                    controller: 'indexCtrl'
                }
            }
        })
        .state('app.login', {
            url: "/login",
            views: {
                'menuContent': {
                    templateUrl: "templates/login.html",
                    controller: 'loginCtrl'
                }
            }
        })

    .state('app.register', {
        url: "/register",
        views: {
            'menuContent': {
                templateUrl: "templates/register.html",
                controller: 'registerCtrl'
            }
        }
    });
    // if none of the above states are matched, use this as the fallback
    $urlRouterProvider.otherwise(function() {
        var logged = mainItemsList.isLoggedIn();
        // Check User logined or not
        if (logged != true) {
            return 'app.login';
        } else {
            return 'app.masterList';
        }

    });


});