Angular 6 - Написание класса Resolve для маршрутизации, который может возвращать более одного набора данных - PullRequest
0 голосов
/ 21 октября 2018

Я читал в Интернете, как реализовать функцию разрешения с помощью маршрутов в Angular.Однако в каждом примере я сталкивался с написанным классом разрешения, который брал только определенные данные из одного сервиса.Например:

import { Injectable } from '@angular/core';
import { APIService } from './api.service';

import { Resolve } from '@angular/router';

@Injectable()
export class APIResolver implements Resolve<any> {
  constructor(private apiService: APIService) {}

  resolve() {
    return this.apiService.getItems();
  }

}

В app.routing.ts:

const routes: Routes = [
{
  path: 'items/:date',
  component: ItemsComponent,
  resolve: { items: APIResolver }
}
]

Но что, если я хочу, чтобы разрешение множественное разрешалось?Например:

import { Injectable } from '@angular/core';
import { APIService } from './api.service';

import { Resolve } from '@angular/router';

@Injectable()
export class APIResolver implements Resolve<any> {
  constructor(private apiService: APIService) {}

  resolveItems() {
    return this.apiService.getItems();
  }

 resolveCars() {
    return this.apiService.getCars();
  }

 resolvePeople() {
    return this.apiService.getPeople();
  }

}

Как я могу провести рефакторинг этих онлайн-примеров, чтобы я мог получить разные данные разрешения?

Я прошу прощения, если этот вопрос звучит немного двусмысленно.Я могу уточнить, если это необходимо.

1 Ответ

0 голосов
/ 21 октября 2018

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

export abstract class APIResolve<T> implements Resolve<T> {
  constructor(readonly apiService: APIService) {}

  abstract resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<T>;
}

и иметь несколько распознавателей:

export class APIItemResolve<T> extends APIResolve<T> {
  resolve(): Observable<T> {
    return this.apiService.getItems();
  }
}

export class APIPeopleResolve<T> extends APIResolve<T> {
  resolve(): Observable<T> {
    return this.apiService.getPeople();
  }
}

export class APICarResolve<T> extends APIResolve<T> {
  resolve(): Observable<T> {
    return this.apiService.getItems();
  }
}

, и ваши маршруты будут такими:

const routes: Routes = [{
  path: 'items/:date',
  component: ItemsComponent,
  resolve: { 
    items: APIItemResolve,
    peoples: APIPeopleResolve,
    cars: APICarResolve
  }
}]

Другой способ - принять глобальное решение и сохранить свои предметы / людей / автомобили в общей службе вместо данных маршрута

...