混合离子手机应用程序:登录成功后隐藏登录屏幕

Question

我正在用离子框架开发移动应用程序。它有一个带有以下链接的侧菜单

1.主页

1.登录

2.关于

3.设置

当用户登录时，我想将侧菜单中的login更改为myprofile链接

在登录控制器中

.controller('LoginCtrl',function($scope,$http,$ionicPopup,$state){
   $scope.login=function(user){
      //http call for login api 
      //set the auth token
      window.localStorage.setItem('usertoken',response.token);
      $state.go('app.profile');
     }
}})

菜单控制器

.controller('MenuCtrl', function($scope, $ionicModal, $timeout) {
  //shows the login link when the user is not logged in othewise show profile.
  if(window.localStorage.getItem('usertoken')==null){
       $scope.showloginlink=true;
       $scope.showprofilelink=false;
  }else{
      $scope.showloginlink=false;
      $scope.showprofilelink=true;
  }
});

这是htmll

<ion-list >
        <ion-item menu-close href="#/app/login" ng-show="showloginlink">
          Login
        </ion-item>
        <ion-item menu-close href="#/app/profile" ng-show="showprofilelink">
          Profile
        </ion-item>

问题是登录后它没有显示配置文件链接，但当我刷新整个页面时，它会像我预期的那样工作如何解决这个问题？

更新

我已经通过重新加载状态解决了问题

$state.go('app.profile',null,{reload: true});

但我会遇到另一个错误，我的user_profilepage中缺少侧菜单我已经在menu.html中添加了这个enable-menu-with-back-views="true"，但我仍然有菜单丢失的问题：（

注意：我使用的是离子标签模板

Answer 1

试着用$apply包装你的作业，如下所示：

$scope.$apply(function() {
  if(window.localStorage.getItem('usertoken')==null){
       $scope.showloginlink=true;
       $scope.showprofilelink=false;
  }else{
      $scope.showloginlink=false;
      $scope.showprofilelink=true;
  }    
});

如果您得到一个错误，说摘要已经在运行，请交换$scope$使用$timeout应用，这是您需要注入的服务。如果您没有指定特定的延迟，那么更新将推迟到下一次摘要。

因此，首先将其作为参数添加到控制器中：

.controller('LoginCtrl',function($scope,$http,$ionicPopup,$state, $timeout){

然后，替换$scope$从上一个列表中应用：

$timeout(function() {
  if(window.localStorage.getItem('usertoken')==null){
       $scope.showloginlink=true;
       $scope.showprofilelink=false;
  }else{
      $scope.showloginlink=false;
      $scope.showprofilelink=true;
  }    
});