如何在app.html的侧边菜单中显示/隐藏菜单项？ Ionic 2

在我的app.component.ts中，我定义了将出现在我的侧边菜单中的页面。而在我的app.html我有我的<ion-menu>与所有菜单项。但是，有一些在用户登录时被激活。如何在app.html的侧边菜单中显示/隐藏菜单项？ Ionic 2

在我app.component.ts我得到了用户的令牌知道如果我登录，我将它保存在一个变量（当用户登录，这是保存在localstorage）这个我用ngIf把它作为条件在我的HTML 。

但是，当用户在应用程序中导航并单击注销时，侧面菜单不会被刷新超过从本地存储中删除用户令牌。

这是我app.component.ts：

import { HomePage } from '../pages/home/home'; 
import { LoginPage } from './../pages/login/login'; 
import { OtherPage1 } from './../pages/others/other_one'; 
import { OtherPage2 } from './../pages/others/other_two'; 

export class MyApp { 
    @ViewChild('content') menu : NavController; 
    rootPage:any = HomePage; 
    public userToken; 
    login = LoginPage; 
    home = HomePage; 
    other_1 = OtherPage1; 
    other_2 = OtherPage2; 

    constructor(...) { 
    platform.ready().then(() => { 
     statusBar.styleDefault(); 
     splashScreen.hide(); 
    }); 

    this.userToken = localStorage.getItem('idTokenUser'); 

    [...] 
    } 

    goPage(page:any){ 
    this.menu.setRoot(pagina); 
    this.menuCtrl.close(); 
    } 

    logout(){ 
    localStorage.removeItem('idTokenUser') 
    this.menu.setRoot(HomePage); 
    this.menuCtrl.close(); 
    } 

}

这是我app.html：

<ion-menu [content]="content" persistent="true"> 
    <ion-header color="primary"></ion-header> 
    <ion-content> 
     <ion-list> 
      <button ion-item (click)="goPage(home)"> 
      <ion-icon item-start name="home"></ion-icon> 
      Home</button> 

      <button ion-item *ngIf="userToken" (click)="goPage(other_1)"> 
      <ion-icon item-start name="clipboard"></ion-icon> 
      Other 1</button> 

      <button ion-item *ngIf="userToken" (click)="goPage(other_2)"> 
      <ion-icon item-start name="people"></ion-icon> 
      Other 2</button> 

      <button ion-item *ngIf="!userToken" (click)="goPage(login)"> 
      <ion-icon item-start name="key"></ion-icon> 
      Login</button> 

      <button ion-item *ngIf="userToken" (click)="logout()"> 
      <ion-icon item-start name="close-circle"></ion-icon> 
      Logout</button> 

     </ion-list> 
    </ion-content> 
</ion-menu> 

<ion-nav [root]="hom" #content></ion-nav>

什么是侧面菜单中删除项目的方式，当用户在任何时候点击注销？

来源

2017-08-16 Dvex

（ 'sidemenu'）。隐藏（）'在注销点击。 – weBBer

改变，如果你愿意，你可以使用`$总是躲在一边菜单登出功能

logout(){ 
    localStorage.removeItem('idTokenUser'); 
    this.userToken = null; 
    this.menu.setRoot(HomePage); 
    this.menuCtrl.close(); 
    }

来源

2017-08-16 15:14:34 iTR

如何在app.html的侧边菜单中显示/隐藏菜单项？ Ionic 2

回答

相关问题