登录并注销后,Cordova Ionic刷新侧边菜单

时间:2015-07-07 09:56:31

标签: javascript angularjs cordova visual-studio-2013 ionic

我正在尝试在登录和注销后自动重新加载我的侧边菜单。我正在通过检查我的window.localStorage来做到这一点。我经历过,在我执行操作登录或注销后,侧边菜单不会重新加载/刷新。

我正在使用$ state.go('tabs.home')导航到另一个页面,但我的侧边菜单不会刷新。

下面是我的代码:

navCtrl:

app.controller('NavCtrl', function ($scope, $ionicSideMenuDelegate, $rootScope) {
    $scope.showMenu = function () {
        $ionicSideMenuDelegate.toggleLeft();
    };
    $scope.showRightMenu = function () {
        $ionicSideMenuDelegate.toggleRight();
    };

    var data = JSON.parse(window.localStorage.getItem("currentUserData"));
    if (data != null) {
        if (data["id_gebruiker"] == null) {
            $rootScope.control = {
                showLogin: false,
                showLogout: true
            };
        }
        else {
            $rootScope.control = {
                showLogin: true,
                showLogout: false
            };
        }

    }

})

navHtml:

<ion-side-menu-content ng-controller="NavCtrl">
          <ion-nav-bar class="bar-positive">
            <ion-nav-back-button class="button-icon ion-arrow-left-c">
            </ion-nav-back-button>

            <ion-nav-buttons side="left">
              <button class="button button-icon button-clear ion-navicon" ng-click="showMenu()">
              </button>
            </ion-nav-buttons>

            <ion-nav-buttons side="right">
              <button class="button button-icon button-clear ion-ios7-gear" ng-click="showRightMenu()">
              </button>
            </ion-nav-buttons>
          </ion-nav-bar>
          <ion-nav-view animation="slide-left-right"></ion-nav-view>
        </ion-side-menu-content> 

loginCtrl:

app.controller('LoginCtrl', function ($scope, $http, $state) {
    /*
    * This method will be called on click event of button.
    * Here we will read the email and password value and call our PHP file.
    */

    $scope.check_credentials = function () {

        //document.getElementById("message").textContent = "";

        $http({ method: 'GET', url: 'http://localhost:34912/api/gebruikers?email=' + $scope.email + '&wachtwoord=' + $scope.wachtwoord }).success(function (data) {
            bindUserData(data);
            //window.location.reload();

            $state.go('tabs.about');
        });

        function bindUserData(data) {
            //alert(JSON.stringify(data));
            window.localStorage.setItem("currentUserData", JSON.stringify(data));
        }
    }
});

app.controller('LogoutCtrl', function ($scope, $http, $state) {
    /*
    * This method will be called on click event of button.
    * Here we will read the email and password value and call our PHP file.
    */

    $scope.logout = function () {

        var data = JSON.parse(window.localStorage.getItem("currentUserData"));
        if (data != null) {
            window.localStorage.removeItem("currentUserData");
            $state.go('tabs.home');
        }
    }
});

loginHtml:

<ion-view title="Login">
    <ion-content>
        <form id="loginForm" ng-app="ionicApp" ng-controller="LoginCtrl">
            <div class="list">
                <label class="item item-input">
                    <span class="input-label">Email</span>
                    <input ng-model="email" type="text" placeholder="Username" />
                </label>

                <label class="item item-input">
                    <span class="input-label">Wachtwoord</span>
                    <input ng-model="wachtwoord" type="password" placeholder="***********" />
                </label>
            </div>
            <div class="padding">
                <input type="submit" value="Log on" ng-click="check_credentials()" class="button button-block button-positive" />
            </div>
        </form>
    </ion-content>

我希望你能理解我的问题。我还尝试在$ state.go之前做一个window.location.reload(),但这看起来很麻烦。是否有一些最佳实践来解决我的问题?请帮帮我!

问候。

1 个答案:

答案 0 :(得分:4)

查看https://stackoverflow.com/a/30524540/1376640

处接受的解决方案

代码的相关部分是:

$scope.logout = function () {
    $ionicLoading.show({
        template: 'Logging out....'
    });
    $localstorage.set('loggin_state', '');

    $timeout(function () {
        $ionicLoading.hide();
        $ionicHistory.clearCache();
        $ionicHistory.clearHistory();
        $ionicHistory.nextViewOptions({
            disableBack: true,
            historyRoot: true
        });
        $state.go('login');
    }, 30);

};

为我工作。

相关问题