angular - 如何在页面中使用组件
问题描述
我正在尝试在几个页面中添加一个自定义组件。
- 我创建了我的页面:
ionic g pages name
- 我创建了我的组件:
ionic g component name
在这一点上,我只是试试这个:
<ion-content>
<app-menu-button></app-menu-button>
</ion-content>
app-menu-button 是组件选择器
我收到此错误: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 文件中删除您的导入和声明,该文件是在您创建自定义组件时自动添加的。
推荐阅读
- php - Bootstrap 4.3.1 模态不工作
- java - 从 SQLite 数据库中检索图像(BLOB 数据类型)
- python - 如何删除我的不和谐机器人在特定频道中发送的先前消息?
- javascript - 资产文件未在 Shopify 上加载
- php - Symfony 5 - 如何从一对一关系向表单添加字段?
- node.js - Node js Express 多次执行单个调用
- python - 警告:此运行时之前已导入以下包:[PIL] 您必须重新启动运行时才能使用新安装的版本
- jquery - 如何在选择复选框、单选按钮等时执行事件
- python - 尝试使用带有并发期货的等待来附加到数据帧并在大约 90% 的时间里得到一个关键错误
- keycloak - 将 Bearer 令牌从 kong 传递给 keycloak 进行身份验证,然后进行 api 调用