angular - 我的应用程序的每一页上都使用一个组件。我如何声明它以便在全局范围内使用？

Question

我有一个组件 HeroLogoComponent，它在我的应用程序的每个页面的标题元素中使用。它在 app.module 中声明为:

@NgModule({
  declarations: [
  MyApp,
  HeroLogoComponent,
], ...

通过阅读 angular.io 文档，我了解到这应该允许选择器 <hero-logo>用于所有其他 PageComponent。但是，当我将其添加到任何其他页面时，我收到错误

Error: Uncaught (in promise): Error: Template parse errors: 'logo' is not a known element

当我将 PageComponentModule 更改为包含 schemas: [CUSTOM_ELEMENTS_SCHEMA] 时应用程序加载，但组件仅在 HTML 中显示为空

<hero-logo><hero-logo>

里面没有任何模板元素。我宁愿声明/导入此组件一次以便在整个应用程序中使用，而不是在每个单独的 PageComponentModule 中使用。有没有办法做到这一点，以便它可以在全局范围内引用？

谢谢!

编辑:

因此在 app.module.ts 中， Bootstrap 是 IonicApp，因为它是一个 ionic 生成的项目。

bootstrap: [IonicApp],

Bootstrap 中声明的组件是否全局可用？如果是这样，我将如何从 IonicApp 声明它？

Answer 1

使用下面的代码，HeroLogoComponent 将可用于在相同声明数组中声明的每个组件。

@NgModule({
  declarations: [
  MyApp,
  HeroLogoComponent,
], ...

如果您有多个 Angular 模块，并且希望每个 Angular 模块中的每个组件都可以访问它，请按照 Aravind 的建议将其放入共享模块中。然后确保将共享模块导入到您定义的每个具有需要它的组件的 Angular 模块中。

要了解更多信息，请查看:https://www.youtube.com/watch?v=ntJ-P-Cvo7o&t=6s