无法将组件导入页面 - Ionic 4

Question

我正在使用 Ionic 4 和 Angular 7。

我只想构建一个组件以便稍后在应用程序中重用，但我遇到了经典错误：

错误：未捕获（承诺）：错误：模板解析错误：'home-cmp' 不是已知元素： 1. 如果 'home-cmp' 是一个 Angular 组件，那么验证它是这个模块的一部分。 2. 如果“home-cmp”是一个 Web 组件，则将“CUSTOM_ELEMENTS_SCHEMA”添加到该组件的“@NgModule.schemas”以禁止显示此消息。

我做了一个像here 这样的共享模块，但仍然无法正常工作。

I did the same

共享模块：

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { HomeComponent } from './home/home.component';

@NgModule({
  declarations: [HomeComponent],
  imports: [
    CommonModule
  ],
  exports : [ HomeComponent]
})
export class PagesModule { }

我使用它的模块

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { Routes, RouterModule } from '@angular/router';

import { IonicModule } from '@ionic/angular';

import { HomePage } from './home.page';
import { PagesModule } from 'src/app/components/pages/pages.module';


const routes: Routes = [
  {
    path: '',
    component: HomePage
  }
];

@NgModule({
  imports: [
    PagesModule,
    CommonModule,
    FormsModule,
    IonicModule,
    RouterModule.forChild(routes)
  ],
  declarations: [HomePage]
})
export class HomePageModule {}

这是文件树：

编辑

我使用使用自己的路由模块的选项卡

编辑 2

Same problem 但没有回答

Answer 1

如果您在另一个页面的 html 文件中使用 <home-cmp>，则在该页面的 module.ts 中添加以下内容到 @NgModule：

schemas: [CUSTOM_ELEMENTS_SCHEMA]

来自文档：

定义一个允许 NgModule 包含以下内容的模式：

以破折号 (-) 命名的非 Angular 元素。

以破折号 (-) 命名的元素属性。破折号大小写是自定义元素的命名约定。