Ionic 4：使用 ion-bottom-drawer 组件时出错答案

【问题标题】：Ionic 4:Error using ion-bottom-drawer componentIonic 4：使用 ion-bottom-drawer 组件时出错
【发布时间】：2019-08-05 04:59:13
【问题描述】：

我试图在我的应用程序中使用ion-bottom-drawer 组件，但我一直遇到错误。该组件似乎无法识别

重现步骤：

创建 ionic4 项目

npm i ion-bottom-drawer --save
npm ihammerjs@2.0.8 --save
npm i @types/hammerjs@2.0.36 --save

在 app.module.ts 中导入 IonBottomDrawerModule 将组件添加到主页

<ion-bottom-drawer 
    [(state)]="drawerState" 
    [minimumHeight]="minimumHeight" 
    [dockedHeight]="dockedHeight" 
    [shouldBounce]="shouldBounce"
    [distanceTop]="distanceTop"
>
    <div class="drawer-content">
        Bottom Drawer Content
    </div>
</ion-bottom-drawer>

尽管按照文档中的所有步骤操作，组件仍无法识别

【问题讨论】：

标签： ionic-framework ionic4

【解决方案1】：

您应该使用适当的值。

请按以下方式使用。

<ion-bottom-drawer [minimumHeight]=50 [dockedHeight]=350
  [shouldBounce]=true [distanceTop]=50>
  <div class="drawer-content">
    Bottom Drawer Content
  </div>
</ion-bottom-drawer>

这是一个例子

https://stackblitz.com/edit/ionic-bottom-drawer?file=pages%2Fhome%2Fhome.ts

【讨论】：

【解决方案2】：

查看您的 homepage.module.ts 并将其也导入其中：

@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    IonicModule,
    RouterModule.forChild([
      {
        path: '',
        component: HomePage
      }
    ]),
    IonBottomDrawerModule
  ],
  declarations: [HomePage]
})
export class HomePageModule {}

我仍在学习自己，但我认为这是因为延迟加载功能。每个页面都有自己的模块。

【讨论】：

【解决方案3】：

我终于明白了。我必须创建一个组件模块并在那里导入 IonBottomDrawerModule，然后将 CUSTOM_ELEMENTS_SCHEMA 作为模式包含在模块中，并按照文档所述的方式使用该组件。

【讨论】：

是的，我也使用相同的导入 IonBottomDrawerModule 并包含在组件模块中。