Hybrid

ionic3.x创建自定义组件

银戒 · 4月19日 · 2019年 · · · 237次已读

引言

在ionic中一切皆组件,自定义组件就是将一堆重复用到的代码封装成一个组件,方便在多个页面直接调用。

开始

在cmd中敲出如下命令:(two-video是自定义组件的名称)

ionic g component two-video

创建完成后会在项目的components文件夹下面生成一个和组件名字一样的文件夹,如图:

在app.module.ts中引用组件:

import { ComponentsModule  } from '../components/components.module';

在app.module.ts中@NgModule下的imports导入:

ComponentsModule

如下图:

好了,接下来你就可以在其他页面中使用了,如:

<ion-header>
  <ion-navbar>
    <ion-title>Home</ion-title>
  </ion-navbar>
</ion-header>

<ion-content>
      <div class="body">
        <two-video></two-video>
      </div>
</ion-content>

0 条回应