如何在页面中使用组件

debugcn 发表于 Dev

阿毛里·拉罗兹（Amaury Laroze）

我试图在几个页面中添加一个自定义组件。

我创建了页面： ionic g pages name
我创建了我的组件： ionic g component name

在这一点上，我只是尝试：

<ion-content>
    <app-menu-button></app-menu-button>
</ion-content>

应用程序菜单按钮是组件选择器

我收到此错误： 1. If 'app-menu-button' is an Angular component, then verify that it is part of this module.

我尝试在我的应用程序模块文件中添加：

exports: [
    MenuButtonComponent
  ]

但这是行不通的。

我的目标是在多个页面中显示此组件。

谢谢，

圣地亚哥·瓦尔迪兹

如果使用延迟加载，则必须在页面模块中导入自定义组件。例如：如果要AppMenuButtonComponent在名为的页面中使用组件ExamplePage，则必须将其导入页面模块中。

import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { ExamplePage } from './example';
import { AppMenuButtonComponent } from '../../components/appmenubutton/appmenubutton';

@NgModule({
  declarations: [
    ExamplePage,
    AppMenuButtonComponent
  ],
  imports: [
    IonicPageModule.forChild(ExamplePage),

  ],
  exports: [
    ExamplePage,
  ]
})
export class ExamplePageModule {

}

不要忘记从创建自定义组件时自动添加的app.module.ts文件中删除导入和声明。

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。