Ionic4.x 中自定义公共模块

时间:2023-10-29 17:41:20

1、创建公共模块以及组件

ionic g module module/slide
ionic g component module/slide

2、公共模块 slide.module.ts 中暴露对应的组件

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { SlideComponent } from './slide.component'; @NgModule({
declarations: [SlideComponent],
imports: [
CommonModule
],
exports:[SlideComponent]
})
export class SlideModule { }

3、用到的地方引入自定义模块,并依赖注入自定义模块

import { SlideModule } from '../module/slide/slide.module';
@NgModule({ imports: [
CommonModule, FormsModule,
IonicModule,
SlideModule, RouterModule.forChild(routes)
],
declarations: [Tab4Page] })

4、使用自定义模块

<app-slide></app-slide>

Ionic4.x 自定义公共模块中使用 ionic 内 置组件

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { SlideComponent } from './slide.component';
import{IonicModule} from '@ionic/angular'; @NgModule({
declarations: [SlideComponent],
imports: [
CommonModule,
IonicModule
],
exports:[SlideComponent]
})
export class SlideModule { }