Question

我的Angular 2项目中有以下模块结构：

  app
   |-module1
   |-module2
        |-component2-1
        |-component2-2
        |-factories

工厂模块有几个提供者定义如下：

@NgModule({
    providers: [                               
        { provide: Class1,          
          useFactory: Class1Factory,
          deps: [SameModuleDependency],          
          multi: true                       
        },
        { provide: Class2,
          useFactory: Class2Factory
        }
    ]
})

export function Class1Factory(): Class1 { ... }

export function Class2Factory(): Class2 { ... }

假设我想让这些工厂提供程序可用于模块2中的组件2-1和2-2。如何在模块2的模块定义中导入它们？我还没有找到这些的例子。

我想如果我单独导出每个提供商做这样的事情：

Class1Provider: Provider = {provide: Class1, useFactory: ... }
Class2Provider: Provider = {provide: Class2, useFactory: ....}

然后在module2定义中我可以声明它们：

import { Class1Provider, Class2Provider } ....

@NgModule({

  providers: [Class1Provider, Class2Provider]

})

但是，我还没有找到一种方法来完成这项工作（导出实例，而不是类定义）

此外，我希望有几个提供商，并非所有提供商都使用它们，所以我不希望单独导出/导入每个提供商。

奖金问题：如果我想在module1的组件中提供该怎么办？

Answer 1

如果您仅在以下模块中定义提供者：

@NgModule({
    providers: [                               
        { provide: Class1,          
          useFactory: Class1Factory,
          deps: [SameModuleDependency],          
          multi: true                       
        },
        { provide: Class2,
          useFactory: Class2Factory
        }
    ]
})
export class FactoriesModule {}

将FactoriesModule导入根模块就足够了：

@NgModule({
  imports: [
    BrowserModule,
    FactoryModule   <---------------------
  ],
  ...
})
export class AppModule { }

所以组件将能够使用相关令牌注入提供者：

class MyComponent {
    constructor(service: Class1) {}

这是因为在编译期间合并了所有模块的提供程序。

See this demo

我强烈建议您阅读：Avoiding common confusions with modules in Angular文章解释详情

从Angular 2中的兄弟模块导入提供程序

1 个答案: