将 CUSTOM_ELEMENTS_SCHEMA 添加到应用程序模块后未加载子组件

分享于2023年03月15日 angular angular-cli angular2-components angular2-template 问答
【问题标题】:Child Component not loading after adding CUSTOM_ELEMENTS_SCHEMA to the app module将 CUSTOM_ELEMENTS_SCHEMA 添加到应用程序模块后未加载子组件
【发布时间】:2023-03-14 12:40:01
【问题描述】:

我有一个名为 HostComponent 的组件,当我将此组件作为启动组件时,一切正常,我的应用程序运行良好。

然后我再创建一个名为 AppModule 的模块并将宿主组件包装在应用程序组件中

import { Component, Input } from '@angular/core';
@Component({
  selector: 'main-app',
  template: 'Loading...'
})
export class AppComponent {
constructor(){

}
}

AppModule

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    ,HostModule 
  ],
  schemas:[],
  bootstrap: [AppComponent],
  entryComponents: [
     SomeOtherEntryComponentsHere
  ]
})
export class AppModule {

}

Index.html


           

主机模块(存在主机组件)

@NgModule({
  declarations: [
    HostComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    DashboardModule,
  ],
  schemas:[CUSTOM_ELEMENTS_SCHEMA],
  exports:[]

})
export class HostModule {

 }

当我尝试运行应用程序时,出现以下错误

为了抑制此错误,我已根据以下参考将 CUSTOM_ELEMENTS_SCHEMA 添加到应用模块。 CUSTOM_ELEMENTS_SCHEMA added to NgModule.schemas still showing Error

我的错误发生了,但我的 <ds-framework-host> 显示正在加载.. 但在这个子组件中没有执行任何操作。在开发人员工具中没有显示错误

Angular 版本 - 4.0.0.0

我该如何解决这个错误以及为什么会发生?

  • 您需要将 ds-framework-host 组件导入到您的 AppComponent 中。您能否也添加您的 ds-framework-host 组件代码。
  • @junky 我确定了这个问题,因为我错过了主机模块中的导出

【解决方案1】:

您的 app.module 的声明数组中没有 ds-framework-host 组件。如果 ds-framework-host 是本机自定义元素,则应仅使用 CUSTOM_ELEMENTS_SCHEMA

【讨论】:

  • 如果组件在另一个模块中,我们不需要进行声明。在我的主机模块中导出组件后,我已经解决了我的问题