Question

我是Ionic 2的新手，我正在为我的应用程序开发一个侧面菜单。现在大多数在线示例都使用了标签并在标签上分配了该菜单。但我没有使用标签，因此侧边菜单是仅在我的主页上工作。以下是我做的代码：的 app.html

<ion-menu [content]="nav">
  <ion-header>
    <ion-toolbar>
      <ion-title>Menu</ion-title>
    </ion-toolbar>
  </ion-header>
  <ion-content>
    <ion-list>
      <button ion-item icon-left (click)="onLoad(homePage)"><ion-icon name="log-in"></ion-icon>Sign In</button>
      <button ion-item icon-left (click)="onLoad(signUpPage)"><ion-icon name="person"></ion-icon>Sign Up</button>
      <button ion-item icon-left (click)="signOut()"><ion-icon name="log-out"></ion-icon>Sign Out</button>
    </ion-list>
  </ion-content>
</ion-menu>
<ion-nav [root]="rootPage" #nav></ion-nav>'

app.component.ts

import {Component, ViewChild} from '@angular/core';
import {MenuController, Nav, Platform} from 'ionic-angular';
import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';

import { HomePage } from '../pages/home/home';
import {SignupPage} from "../pages/signup/signup";
@Component({
  templateUrl: 'app.html'
})
export class MyApp {
  rootPage:any = HomePage;
  homePage=HomePage;
  signUpPage=SignupPage;
  @ViewChild(Nav) nav: Nav;

  constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen,private menuCtrl:MenuController) {
    platform.ready().then(() => {
      // Okay, so the platform is ready and our plugins are available.
      // Here you can do any higher level native things you might need.
      statusBar.styleDefault();
      splashScreen.hide();
    });
  }
  onLoad(page:any){
    this.nav.setRoot(page);
    this.menuCtrl.close();
  }
  signOut(){

  }
}

现在在我的html中（它在home.html中工作，但在其他地方没有）

<ion-header>

  <ion-navbar>
    <ion-title>Choice</ion-title>
    <ion-buttons start>
      <button ion-button icon-only menuToggle>
        <ion-icon name="menu" color="danger"></ion-icon>
      </button>
    </ion-buttons>
  </ion-navbar>
</ion-header>

Ionic 2中的侧面菜单未显示

0 个答案: