CODEWITHSUNDEEP
angularjshtml
Lokendra Singh Panwar
Lokendra Singh Panwar

Reputation: 511

How to get specific state in AngularJS by local-storage?

I want to change state by local-storage in my application after page refresh. How to get the state?.

HTML:

<body ng-app="sampleApp"> 
   <div class="container" ng-controller="Registration" ng-init ="temp()">
     <div ui-view></div>
 </div>

Controller:

var sampleApp = angular.module('sampleApp', 
                        ['ui.router','angularFileUpload','ngStorage']);

        sampleApp.config(function($stateProvider, $urlRouterProvider) { 
        $stateProvider  
            .state('settings', {
                url: '/settings',
                templateUrl: '/ui/step1.htm'
           .state('settings/Personal_Info', {
            url: '/Personal_Info',
            templateUrl: '/ui/step2.htm',
            //controller: 'ProfileController'
        })
        .state('settings/Personal_Info_1', {
            url: '/Personal_Info_1',
            templateUrl: '/ui/step3.htm',
            //controller: 'AccountController'
        })
        .state('settings/P_Info_Affiliations', {
            url: '/P_Info_Affiliations',
            templateUrl: '/ui/step4.htm',
            //controller: 'ProfileController'
        });
            $urlRouterProvider.otherwise('/settings');
        });
    sampleApp.controller("Registration", 
         function ($scope, $location, $http, $state, $localStorage){
            $scope.currentstep = 1;
            $scope.formData = {};

            $scope.temp = function()
            { alert($localStorage.currentstep);
                if($localStorage.currentstep > 0) {
                    $scope.currentstep = $localStorage.currentstep; 
                    $scope.getStepUrl();
                }
            }
         $scope.next = function(formData){ 
    console.log($scope.currentstep);
    //console.log($scope.formData);
        if (formData.check == 1) {
            $scope.currentstep = $scope.currentstep + 1;
            $localStorage.currentstep = $scope.currentstep;
            alert("Everything is validated. We can go ahead");

            $http({
                method  : 'POST',
                url     : 'addstep?step'+ $scope.currentstep,
                data    : $scope.formData, 
                headers : {'Content-Type': 'application/x-www-form-urlencoded'} 
            })
            .success(function(data) {
                if (data.errors) {
                    $scope.errorName = data.errors.name;
                    $scope.errorUserName = data.errors.username;
                    $scope.errorEmail = data.errors.email;
                } else {
                    $scope.message = data.message;
                }
            });
            $scope.getStepUrl();
        }
        else {
            alert("Some issues in input data.");
        }  
    }
        $scope.getStepUrl = function() {

           if($scope.currentstep == 1){
               $state.go('settings');
            }
            else if($scope.currentstep == 2){
                $state.go('settings/Personal_Info');
                alert("i am step 2");
            }
            else if($scope.currentstep == 3){
                $state.go('settings/Personal_Info_1');
            }
         }

 });

I am not geting state properly.
how to solve this issue? Thank you for your help in advance.

Upvotes: 1

Views: 187

Answers (2)

Anke Wenz
Anke Wenz

Reputation: 415

You can get the current state via $state provider and state.current.name So you can ask for current state in each controller or service you would like to use

Upvotes: 1

Lokendra Singh Panwar
Lokendra Singh Panwar

Reputation: 511

Remove the default state

$urlRouterProvider.otherwise('/settings');

Use the else statment in a function

if($localStorage.currentstep > 0) {
            $scope.currentstep = $localStorage.currentstep;

            $scope.getStepUrl();
        }else{
            $state.go('settings');
        }

Upvotes: 0

Related Questions