Question

我对离子骨架很新。我正试图自己做一个侧面菜单。我用这个命令启动了项目。

ionic start testproject blank

在我的新项目中，我从这样的文档中添加了侧边菜单的代码。

App.html

<ion-menu [content]="content">
    <ion-header>
        <ion-toolbar>
            <ion-title>Category</ion-title>
        </ion-toolbar>
    </ion-header>
    <ion-content>
        <ion-list>
            <button ion-item>
                Home
            </button>
        </ion-list>
    </ion-content>
</ion-menu>

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

这是我在打字稿中的代码。

app.component.ts

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

import { HomePage } from '../pages/home/home';
@Component({
  templateUrl: 'app.html'
})
export class MyApp {
  rootPage:any = HomePage;

  constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen, menu: 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();
      menu.enable(true);
    });
  }
}

我在开发者控制台中没有任何错误，只有一个警告和这样的消息。

Angular正在开发模式下运行。调用enableProdMode（）以启用生产模式。

Native：尝试调用StatusBar.styleDefault，但Cordova不可用。确保包含cordova.js或在设备/模拟器中运行

Native：尝试调用SplashScreen.hide，但Cordova不可用。确保包含cordova.js或在设备/模拟器中运行

有人能指出我正确的方向，我的错误是显示我的侧边菜单吗？

Answer 1

您可以在HTML中移动#content吗？我认为变量内容不会被创建。

<ion-nav id="menu" #content [root]="rootPage"></ion-nav>

同时更改line menu.enable（true）。没有身份证就没有意义。

constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen, private menu: MenuController) {
    this.menu.enable(true, 'menu');
    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();
    });
  }

修改

持久性菜单在导航堆栈中的所有页面上显示Navbar中的MenuToggle按钮。要使菜单持久化在元素上持久化为true。

<ion-menu [content]="content" persistent=true>

如果您想在单个页面中添加按钮，只需将关键字 menuToggle 添加到此类按钮

<button ion-button menuToggle>Toggle Menu</button>

侧边菜单不在我的Ionic应用程序中显示

1 个答案:

修改