可重复使用的组件不能以一定角度工作

Question

我的项目文件夹结构如下

我试图在模块中使用可重用组件。为此，我在登录组件中使用了products组件，但如下所示

  

app-products'不是一个已知元素：   1.如果“ app-products”是Angular组件，则请验证它是否是此模块的一部分。   2.如果“ app-products”是Web组件，则将“ CUSTOM_ELEMENTS_SCHEMA”添加到该组件的“ @ NgModule.schemas”以禁止显示此消息。 （“

我的home.module.ts如下所示

imports: [
    CommonModule,
    RouterModule.forChild(HomeRoutingModule),
  ],
  declarations: [UserProfileComponent,ProductsComponent],
  exports:[ProductsComponent]
})

请问这方面任何人都可以提供帮助

Answer 1

  

要么在HomeModule中导入AppModule，要么必须在Login Component中声明HomeModule。

imports: [
    HomeModule
  ],
  declarations: []
})
export class AppModule

Answer 2

主页模块似乎是一个通用模块，而不是根模块-因此，如果您想从该模块中使用components或directive，则需要导出这些组件-您已正确完成

最后-angular将在您需要确保要在应用程序中使用此模块的根模块上运行-因此只需将HomeModule导入AppModule

imports: [
    HomeModule
  ],
  declarations: []
})
export class AppModule

这将停止HomeModule上的延迟加载-实现延迟，只需通过路由就可以绑定公共模块中的组件-希望这会有所帮助-感谢编写愉快的代码！