Ionic 4 自定义组件 [英] Ionic 4 custom components

问题描述

在运行命令 ionic g component myComponent 后，如何在 ionic 4 中加载组件?我想向我的主页添加一个新生成的自定义组件.

How do you load a component in ionic 4 after running the command ionic g component myComponent? I want to add a new generated custom component to my home page.

推荐答案

终于想通了，这是一个有效的重现:

Finally figured this out, here's a repro that works:

ionic start myProject blank --type=angular
ionic g module components
ionic g component components/myComponent --export

这会为myComponent"添加声明和导出到组件模块.

This adds both a declaration and export to the components module for "myComponent".

要使用该组件，只需将 ComponentsModule 添加到页面模块中的 imports 中，例如

To use the component just add ComponentsModule to your imports in your page module, e.g.

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

这样就不会向 app.module.ts 添加任何内容，这就是它应该的样子.

This way nothing is added to app.module.ts which is how it should be.

另外请注意，如果您想在自己的自定义组件中使用任何组件，则需要将 IonicModule 添加到 components.module.ts<中的 imports/代码>

Also note if you want to use ANY components in your own custom components, you need to add IonicModule to the imports in components.module.ts

希望这有帮助:-)

这篇关于Ionic 4 自定义组件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！