在 Angular 的延迟加载模块中显示组件时出错

Question

我创建了一个组件，它的名称是 s-header。 这个组件在 HomeModule 中注册，因为它是这个模块的一部分，但是当我尝试在 home.component.html 中显示这个组件时，它给了我这个错误。

如果“s-header”是 Angular 组件，则验证它是否是该模块的一部分。

如果“s-header”是 Web 组件，则将“CUSTOM_ELEMENTS_SCHEMA”添加到该组件的“@NgModule.schemas”以禁止显示此消息。

这是我的代码

import { HeaderComponent } from '../../general-components/header/header.component';

declarations: [
    HeaderComponent,
],

这是一个 header 组件

import { Component, OnInit } from '@angular/core';

@Component({
    selector: 's-header',
    templateUrl: './header.component.html',
    styleUrls: ['./header.component.css']
})
export class HeaderComponent implements OnInit {

    constructor() { }

    ngOnInit(): void {
    }
}

这就是我试图展示它的方式

<s-header></s-header>

Answer 1

如果这是没有 Ivy 的 Angular 版本 - 您还需要将此组件添加到延迟加载模块的入口组件数组中。 这是因为该组件的工厂不存在（因为它来自延迟加载的模块）

简单地：

import { HeaderComponent } from '../../general-components/header/header.component';

declarations: [
    HeaderComponent,
...
],
entryComponents: [
    HeaderComponent
]