在FactoryProvider中检索和响应路由参数

时间:2018-11-27 14:35:29

标签: angular angular-routing

我想使用 FactoryProvider ,它可以根据当前URI选择服务实现。

此外,其中一种实现方式需要对路由参数(由route/:parameter定义)做出反应。

如下所示,我订阅了不幸的是,我无法以这种方式访问​​参数。在主路由器出口中实例化的组件可以访问它们,但是FactoryProvider无法访问它们。

有什么我可能想念的吗?

模块代码(为提高可读性而缩写)

@NgModule({
  declarations: [],
  imports: [],
  exports: [],
  providers: [XServiceProvider],
  entryComponents: []})

工厂提供者

export const XServiceProvider = {
    provide: XService,
    useFactory: XServiceFactory,
    deps: [Http, HttpService, ConfigurationService, DatePipe, Router, ActivatedRoute]
  };

const XServiceFactory = (http: Http,
                               httpService: HttpService,
                               configuration: ConfigurationService,
                               datePipe: DatePipe,
                               router: Router,
                               activatedRoute: ActivatedRoute) => {

   const useAlternateImpplementation= router.url.startsWith('/mg/');


if (useAlternateImpplementation === true) {
    const service = new XyService(http, httpService, configuration, datePipe);

for (const child of activatedRoute.root.children) {
        if (child.outlet === PRIMARY_OUTLET) {
            child.url.subscribe(params => {
                 service.setParam(params[parameter]);
             });
        }
    }
    return service;
  }
  return new XService(http, httpService, configuration, datePipe);
};

1 个答案:

答案 0 :(得分:0)

通过将依赖项注入范围从Singleton更改为Transient解决了该问题。

方法如下:

  • 从模块中删除提供者定义
  • 将其添加到实际需要它的组件中

代码示例:

@NgModule({
    declarations: [],
    exports: [],
    providers: [ /* remove here! */ ]
})
//...

@Component({
  selector: '...',
  templateUrl: '...',
  styleUrls: ['...'],
  providers: [XServiceProvider] /* add here */
})
//...

(可能是)以下原因:

  • 被声明为模块范围的提供程序的服务在每个应用程序创建后创建一次。因此,您将无法加载应用,使用服务实现一,更改上下文,使用实现二。
  • 声明每个组件的提供程序都会更改此模式。根据路由实例化和销毁组件。也就是说,另一条路径现在可以导致另一种实现。

我受blog post的启发尝试了这一点。

不过,我仍然不知道如何访问超出渲染到主要出口的组件范围的路由参数。