Angular 2：基于路由提供服务实现

Question

我有一个角度应用程序animals，它根据当前路线位置显示动物的图片。例如，/dog 将在页面上显示狗图片，/cat 将在页面上显示猫图片。

为了实现它，我创建了 3 个功能模块 - AnimalBoxModule、CatModule 和 DogModule。 AnimalBoxModule 有一个组件 AnimalBoxComponent 和一个服务 AnimalService。 AnimalBoxComponent 使用 AnimalService.getPicture() 获取动物的图像。 DogModule 和CatModule 有DogService 和CatService 可用于提供AnimalService 的自定义实现，分别显示猫和狗的图片。

我在AppComponent 中渲染<animal-box></animal-box>。为了显示正确的动物图片，我必须根据当前路线位置提供服务实现（CatService 或DogService）。在 Angular 中怎么可能？

提前致谢

编辑

我不想对正在使用该服务的AnimalBoxComponent 进行任何更改，因为我将其呈现为可重用组件。 IMO，当我们想要扩展这个应用程序以提供更多动物服务时，更改它不是一个好主意。

Answer 1

好的，看来您可以使用 Angular Injector 来执行此操作，有一个帖子 here 可以回答您的问题。

import { Injector } from '@angular/core'  
...
constructor(private injector: Injector){ 

  if(true) {
    this.oneService = <OneService>this.injector.get(OneService);
  } else {
    this.twoService = <TwoService>this.injector.get(TwoService);
  }
}

我会阅读这篇文章，因为它有更多关于原因的信息。