Angular 角度:从延迟加载的模块导出组件

Angular 角度:从延迟加载的模块导出组件,angular,Angular,AppModule: 将外壳模块作为延迟加载 外壳模块: 导入SharableModule 使用共享组件 将FooModule作为延迟加载 共享模块: 导出SharableComponent 提供共享服务 foodModule: 路由FooComponent或BarComponent FooComponent,BarComponent 使用ShareableComponent 无法使用SharableModule。使用延迟加载导出,因此无法在FooModule

AppModule

  • 外壳模块
    作为延迟加载
  • 外壳模块

    • 导入
      SharableModule
      • 使用
        共享组件
    • FooModule
      作为延迟加载
  • 共享模块

    • 导出
      SharableComponent
    • 提供共享服务
  • foodModule

    • 路由
      FooComponent
      BarComponent
  • FooComponent
    BarComponent

    • 使用
      ShareableComponent

  • 无法使用
    SharableModule。使用延迟加载导出
    ,因此无法在
    FooModule

    是这样吗

    我将
    SharableModule
    的组件列表添加到
    FooModule
    中,然后正常工作

    但出现错误,因为在2个模块上声明(
    ShellModule
    FooModule

    但是
    ShellModule
    所需的组件
    sharablemodel
    功能,如
    FooModule

    有什么好办法吗


    不要使用SharableModule来提供SharableService,因为导入该服务的每个延迟加载的模块最终都会得到该服务的不同实例。若您需要将所有这些服务作为单例使用,那个么将它们添加到核心模块中。您还可以创建一个单独的core-service.module。使用共享模块仅共享组件或指令

    你可以这样做

    core-components.module.ts[ Add core components]
    core-services.module.ts[ Add all shared services]
    shared.module.ts [ this module exports all shared component and modules]
    
    在shell.module.ts中导入SharedModule,即shared.module 在foo.module中导入SharedModule,即shared.module 类似地,您可以添加任意数量的模块[延迟加载或非延迟加载],只导入SharedModule作为公共模块


    这将防止任何循环依赖,并允许您在应用程序模块之间共享公共组件。

    不要使用SharableModule来提供SharableService,因为导入该服务的每个延迟加载的模块最终都会得到不同的服务实例。若您需要将所有这些服务作为单例使用,那个么将它们添加到核心模块中。您还可以创建一个单独的core-service.module。使用共享模块仅共享组件或指令

    你可以这样做

    core-components.module.ts[ Add core components]
    core-services.module.ts[ Add all shared services]
    shared.module.ts [ this module exports all shared component and modules]
    
    在shell.module.ts中导入SharedModule,即shared.module 在foo.module中导入SharedModule,即shared.module 类似地,您可以添加任意数量的模块[延迟加载或非延迟加载],只导入SharedModule作为公共模块


    这将防止任何循环依赖性,并允许您在应用程序模块之间共享公共组件。

    这一点在第二部分中得到了全面的解决

    通常情况下,您应该有
    共享.module
    ,您可以在其中导入/导出所有可共享组件/指令、其他模块。它将被导入到任何您想要使用它的延迟加载模块中

    对于
    服务
    ,通常它们应该是整个应用程序使用的单实例。因此,应该将它们分组到所谓的
    核心.module
    中,该模块将导入到您的
    根.module
    (又称.app.module`)中

    任何功能模块都应该是延迟加载模块

    项目结构如下所示:

    +--app
        |
        +--core.module/
        |   |
        |   +--(import your sevices here...)
        |
        +--shared.module
        |   |
        |   +--(import/export all your components/directives/modules here)
        |
        +--any-lazy-loading.module
        |   |
        |   +--(import shared-module here)
        |
        app.module
            |
            +--(import core.module here)
    

    这一问题在会议上得到了相当全面的解决

    通常情况下,您应该有
    共享.module
    ,您可以在其中导入/导出所有可共享组件/指令、其他模块。它将被导入到任何您想要使用它的延迟加载模块中

    对于
    服务
    ,通常它们应该是整个应用程序使用的单实例。因此,应该将它们分组到所谓的
    核心.module
    中,该模块将导入到您的
    根.module
    (又称.app.module`)中

    任何功能模块都应该是延迟加载模块

    项目结构如下所示:

    +--app
        |
        +--core.module/
        |   |
        |   +--(import your sevices here...)
        |
        +--shared.module
        |   |
        |   +--(import/export all your components/directives/modules here)
        |
        +--any-lazy-loading.module
        |   |
        |   +--(import shared-module here)
        |
        app.module
            |
            +--(import core.module here)
    

    谢谢,我想用更好的方式解决这个问题,比如
    provideIn
    ,但似乎不可能。你自己做过树吗?或者使用过任何工具吗?这个简单的树可以用任何编辑器创建。你能指定
    provideIn
    ?如果有ascii树自动生成器,我想知道。对不起,它是在
    中提供的。我只是想要组件声明,比如没有附加代码的延迟加载,或者希望使用它。至少像
    providedIn
    一样,这有点离题,但是如果你使用linux,那么只要
    sudo apt get install tree
    ,你就可以打印当前文件夹树作为
    tree
    。谢谢,我想用更好的方式来处理这个问题,就像
    providedIn
    ,但似乎不可能。你自己做过树吗?或者使用过任何工具吗?这个简单的树可以用任何编辑器创建。你能指定
    provideIn
    ?如果有ascii树自动生成器,我想知道。对不起,它是在
    中提供的。我只是想要组件声明,比如没有附加代码的延迟加载,或者希望使用它。至少与中提供的
    一样,这有点离题,但是如果您使用的是linux,那么只需
    sudo apt get install tree
    ,就可以将当前文件夹树打印为
    tree