Problem with show value in left-menu

I’m a big question regarding this issue. When the user logs in my application I would like to show the user name in the left side menu but can not. As I can do to send that value is stored in a service or $ rootScope?

.state('eventmenu', {
  url: "/event",
  abstract: true,
  templateUrl: "event-menu.html"
})

My menu :

<script id="event-menu.html" type="text/ng-template">
  <ion-side-menus>

  <ion-pane ion-side-menu-content>
    <ion-nav-bar class="bar-stable">
      <ion-nav-back-button class="button-clear"><i class="icon ion-chevron-left"></i> Volver</ion-nav-back-button>
    </ion-nav-bar>
    <ion-nav-view name="menuContent" animation="slide-left-right"></ion-nav-view>
  </ion-pane>

  <ion-side-menu side="left">
      <ion-content style="margin-top: 0px;">
      <div class="row background-orange" id="menu-header">
        <div clsss="col">
          <div id="menu-avatar" style="background-image:url('img/default_avatar.png')"></div>
        </div>
        <div clsss="col">
          <div class="datos_usuario">
            <p>{{username}}</p>
          </div>
        </div>
      </div>
       
        <ul class="list menu">
          <a href="#/event/home" class="item item-icon-left" menu-close><i class="icon ion-home"></i>Inicio</a>
          <div class="list" style="margin-top: 0px;">
          <a class="item item-icon-left" href="#/event/misviews" menu-close>
            <i class="icon ion-email"></i>
            Mis Views
          </a>
          <a class="item item-icon-left item-icon-right" href="#/event/lugares" menu-close>
            <i class="icon ion-map"></i>
            Mis Organizaciones
            <i class="icon ion-ios7-telephone-outline" menu-close></i>
          </a>
          <a class="item item-icon-left" href="#" menu-close>
            <i class="icon ion-ios-chatboxes"></i>
            Respuestas
            <!--<span class="item-note">
              Prueba
            </span>-->
          </a>
          <a class="item item-icon-left" href="#" menu-close>
            <i class="icon ion-android-notifications-none"></i>
            Notificaciones
            <span class="badge badge-assertive">3</span>
          </a>
          <div class="item item-divider">
            Configuraci&oacute;n
          </div>
          <a class="item item-icon-left" href="#" menu-close>
            <i class="icon ion-ios-gear"></i>
            Mi Cuenta
          </a>
        </div>
        </ul>
      </ion-content>
    </ion-side-menu>
  </ion-side-menus>
</script>

It would also save the value to be displayed :

$http({method: 'GET', url: URL_BASE+'authenticate/'+$scope.data.username+"/"+$scope.data.password})
      .success(function(data){
        if(data.status == 1){
          sessionService.set("user",data.nombre);
          sessionService.set("photo",data.photo);
          $rootScope.username = data.nombre;
          $rootScope.userImage = data.photo;
          $state.go('eventmenu.home');
        }else{
          var alertPopup = $ionicPopup.alert({
            title: 'Error de Conexión',
            template: 'Tu nombre de usuario o contraseña son incorrectos'
          });
        }
      })
      .error(function(){
        //console.log("Error en la conexion al Servidor")
      })
      .finally(function(){
        $scope.hide();
      });

Can’t you just set the user’s name in your scope and then display it in the side menu?

$http({method: 'GET', url: URL_BASE+'authenticate/'+$scope.data.username+"/"+$scope.data.password})
      .success(function(data){
        if(data.status == 1){
          sessionService.set("user",data.nombre);
          sessionService.set("photo",data.photo);
          $rootScope.username = data.nombre;
          $rootScope.userImage = data.photo;

          // =============================
          $scope.UserRealName = data.nombre; // Set the user's name in the scope.
          // =============================

          $state.go('eventmenu.home');
        }else{
          var alertPopup = $ionicPopup.alert({
            title: 'Error de Conexión',
            template: 'Tu nombre de usuario o contraseña son incorrectos'
          });
        }
      })
      .error(function(){
        //console.log("Error en la conexion al Servidor")
      })
      .finally(function(){
        $scope.hide();
      });

And the somewhere in the side menu content you could just do this:

   <ion-side-menu side="left">
      <ion-content style="margin-top: 0px;">
            {{ UserRealName }}
      </ion-content>
    </ion-side-menu>

Is this what you mean?

~ Brad

1 Like

Thanks to your response found my mistake. RootScope I thought that was stored in cache, so every time I tried to enter the application and log was already sent to the home page and the value was lost. Check the code and everything works fine. Thank you very much!

if(sessionStatus.auth()){
    $rootScope.username = sessionService.get("user");
    $state.go('eventmenu.home');
}

Good stuff, glad I could help.

~ Brad

1 Like