如何在已登录用户的ionic中更改侧面菜单

Rim Bejaoui 发表于 Dev

里姆·贝贾维（Rim Bejaoui）

我想在用户登录时更改侧面菜单的内容。

示例1-用户未登录：

当用户未登录时，将显示此侧面菜单。

示例2-用户登录：

如您所见，还有几个额外的菜单项。这些仅在用户登录时显示。

在我的控制器中：

$http.get('http://127.0.0.1:8080/elodieService/consommateurs/'+$localStorage.idconsommateur, { params: { "idconsommateur":$localStorage.idconsommateur, fields: "nom,prenom",format:"json"} }).then(function(result) {

                console.log(JSON.stringify(result.data));
                $scope.prenomconsommateurConnect=result.data.prenom;

在视图中：

 <ion-header-bar class="bar-stable" >
                <h1 class="title" ng-hide="!prenomconsommateurConnect" ng-controller="accueilController">Bonjour Hello {{prenomconsommateurConnect}}</h1>
                <h1 class="title" ng-hide="prenomconsommateurConnect" ng-controller="accueilController">Bonjour Hello link</h1>

                </ion-header-bar>

但我总是发现此结果“ bonjour hello link”，我该怎么办？

我能做些什么？我应该使用ng-if，ng-show还是ng-hide？还是针对这种情况有更好的解决方案？

任何帮助表示赞赏。

the_mahasagar

您可以放ng-if或ng-show和ng-hide ..我用过ng-if ..！

在菜单控制器中：

.controller('AppCtrl', function($scope, $ionicModal, $timeout,$ionicSideMenuDelegate,$http) {

$http.get('http://127.0.0.1:8080/elodieService/consommateurs/'+$localStorage.idconsommateur, {
  params: { "idconsommateur":$localStorage.idconsommateur, fields: "nom,prenom",format:"json"} })
  .then(function(result) {
  console.log(JSON.stringify(result.data));
    if(result.data.prenom) {
      $scope.prenomconsommateurConnect = result.data.prenom;
    }else{
      $scope.prenomconsommateurConnect = "";
    }
});

$scope.$watch(function () {
  return $ionicSideMenuDelegate.getOpenRatio();
}, function (value) {
  console.log("value " + value);
  $scope.getMenuProfile();
});

$scope.getMenuProfile = function () {
  if($scope.prenomconsommateurConnect === "" ){
    $scope.isLogin =false ;
  }else{
    $scope.isLogin =true ;
  }
};
}

menu.html

<ion-header-bar class="bar-stable">
  <h1 ng-if="!isLogin" class="title">Login plz</h1>
  <h1 ng-if="isLogin"  class="title">U are Login</h1>
</ion-header-bar>

希望这对您有所帮助。

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。