Есть ли способ внедрить другой сервис, основанный на маршруте в angular 2? - PullRequest
Новая
       23

Есть ли способ внедрить другой сервис, основанный на маршруте в angular 2?

0 голосов
/ 13 сентября 2018

Я немного новичок в Angular 2 и его способах внедрения зависимостей, но не совсем смог найти простой способ изменить зависимость компонента на основе маршрута.

IE. С учетом компонента, который принимает службу. 

MyReusableComponent {
   constructor(private service: ServiceIWantToChange){}
}

С учетом того, что я добавляю новый маршрут в другую часть веб-приложения, которое будет повторно использовать компонент.

Я хочу сделать что-то вроде этого: NewAreaRoutingModule 

{ 
   path: "newRoute",
   component: MyReusableComponent,
    ** my made up provider area ** -providers: [{provide: 
      ServiceIWantToChange, useClass: MyServiceWithChanges}]
}

Это то, к чему я привык, как способ обработки зависимых от местоположения зависимостей.

Я думал, что смогу предоставить переопределенную реализацию Компонента, которая обеспечивает новую зависимость для повторно используемого компонента, но я надеялся просто изменить зависимость в маршруте.

Я проводил исследования по распознавателям и т. Д., Но, похоже, они больше предназначены для предоставления данных.Я также заметил кого-то, кто ввел инжектор и сделал проверку if, чтобы получить право на компонент.Видел пару разных способов.Я уверен, что есть кое-что, что мне не хватает в маршрутизации и DI, но я не могу найти ничего простого.Я знаю, что есть обходные пути, но надеялся найти более элегантное решение и просто узнать, возможно ли то, что я хочу сделать.

Спасибо!

Вот примеры использования вслучай, когда я подхожу к этому неправильно в общем ... В одной области системы я хочу использовать службу, которая обращается к одной версии остальных конечных точек на сервере, а в другой части системы я хочу повторно использовать точно такой же компонентно пусть он отправляет свои запросы в другой набор конечных точек.

1 Ответ

0 голосов
/ 13 сентября 2018

Комбинация токенов с данными маршрута дает желаемый результат. Предоставляйте свои услуги, используя разные токены: 

const FIRST_SERVICE_TOKEN = new InjectionToken<string>("FirstService"); 
const SECOND_SERVICE_TOKEN = new InjectionToken<string>("SecondService"); 

@NgModule({
  providers: [
     {
        provide: FIRST_SERVICE_TOKEN,
        useClass: FirstService
     },
     {
        provide: SECOND_SERVICE_TOKEN,
        useClass: SecondService
     }
  ],
})
class AppModule {}

затем укажите зависимость каждого маршрута, используя данные маршрута: 

{path: 'first-route', component: MyComponent, data: {requiredService: FIRST_SERVICE_TOKEN}},
{path: 'second-route', component: MyComponent, data: {requiredService: SECOND_SERVICE_TOKEN}}

и, наконец, используйте данные маршрута, чтобы получить соответствующую услугу 

export class MyComponent{
   private myService;
   constructor(route: ActivatedRoute, injector:Injector){
       const serviceToken = route.snapshot.data['requiredService'];
       this.myService = injector.get(serviceToken)
   }
}
...