时间戳

首页 > 解决方案 > Angular Ionic Side Drawer 不渲染

angular - Angular Ionic Side Drawer 不渲染

问题描述

我有一个角离子应用程序，我正在尝试设置一个侧抽屉。我在基于离子启动器应用程序的非常基本的代码中有以下内容。我不知道为什么我的侧抽屉不渲染。我跟踪了示例并查看了 ionic 文档。

app.component.html

<ion-app>
  <ion-menu side="start">
    <ion-header>
      <ion-toolbar>
        <ion-title>
          Sample App
        </ion-title>
      </ion-toolbar>
    </ion-header>
    <ion-content>
      <ion-list>
        <ion-item>
          <ion-icon name="business" slot="start"></ion-icon>
          <ion-label>Sample Drawer Item</ion-label>
        </ion-item>
      </ion-list>
    </ion-content>
  </ion-menu>
  <ion-router-outlet main></ion-router-outlet>
</ion-app>

test.page.html

<ion-header>
  <ion-toolbar>
    <ion-buttons slot="start">
      <ion-menuitem menu="m1"></ion-menuitem>
    </ion-buttons>
    <ion-title>places</ion-title>
  </ion-toolbar>
</ion-header>

<ion-content>

</ion-content>

标签： angularionic-frameworkionic4

解决方案

在这里找到答案：Ionic4 组件 - 菜单：必须有一个“内容”元素来监听拖动事件。

官方文档中确实提到content-id="main"了 ion-menu 属性，但没有提到将其添加到<ion-content id="content">. id="content"如果没有按照上面链接帖子中的建议添加ion-content，它对我不起作用。

推荐阅读