Angular2 Router und Mehrere Beschlüsse in einer route

Im ui-router leicht zu machen, mehrere aufgelöst wird definiert in der route-Konfiguration, so können etwas sagen wie:

export const APP_STATES: Ng2StateDeclaration[] = [
  {
    name: 'dashboard',
    url: '/dashboard', 
    component: DashboardComponent,
    resolve: [
      {
        token: 'playbookDurations',
        deps: [DashboardService],
        resolveFn: (svc: DashboardService) => svc.getPlaybookDurations()
      },
      {
        token: 'playbookSuccesses',
        deps: [DashboardService],
        resolveFn: (svc: DashboardService) => svc.getPlaybookSuccesses()
      },
      {
        token: 'playbookRuns',
        deps: [DashboardService],
        resolveFn: (svc: DashboardService) => svc.getPlaybookRuns()
      },
      {
        token: 'activityLog',
        deps: [DashboardService],
        resolveFn: (svc: DashboardService) => svc.getActivityLog()
      }
    ]
  }
}];

bei der Verwendung der Angular2 router erfordert, dass Sie implementieren eine resolver-Muster für die resolve-parameter. So etwas wie dieses:

import { Resolve, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
import { Injectable } from '@angular/core';
import { DashboardService } from '.';

@Injectable()
export class DashboardResolver implements Resolve<any> {

  constructor(private dashboardService: DashboardService) { }

  resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
    return this.dashboardService.get();
  }

}

dann in meine route, die ich tun so etwas wie:

import { DashboardComponent } from './dashboard.component';
import { DashboardResolver } from './dashboard.resolver';

export const routes = [
  { 
    path: '', 
    children: [
      {
        path: '', 
        component: DashboardComponent,
        resolve: {
          data: DashboardResolver
        }
      }
    ]
  }
];

problem ist es gibt nur EINE lösen. Wie funktioniert eine Implementierung mehrerer beheben Argumente wie die ui-router-Implementierung unterstützt?

Ich nehme an, du hast 2 Möglichkeiten; umsetzen Resolver für jede dieser Eingaben ODER haben die Entschlossenheit zurück, ein Objekt mit all Ihren behebt verschachtelt. Der erste scheint ziemlich Zeremoniell und die zweite klingt ziemlich hacky-so hat es der bessere Weg zu sein.

Sie können fortfahren, mit UIRouter in angular2 BTW :), ich bin dabei.
Ja, ich weiß. Ich bin einfach zu Experimentieren ;P
Brauchen Sie noch Hilfe?
Ich denke, jedes feedback würde helfen, alle @AngularFrance

InformationsquelleAutor amcdnl | 2017-01-09

  1. 25

    Okay, ich hoffe, ich habe nicht falsch verstanden, die Frage.

    Winkel-router unterstützt wie viele Konfliktlöser pro Strecke, wie Sie wollen.

    In der route-Erklärung, die resolve - Eigenschaft ist ein Objekt und es können so viele Tasten, wie Sie möchten:

    {
  path: '', 
  component: DashboardComponent,
  resolve: {
    foo: Resolver1
    bar: Resolver2,
    //more resolves here...
  }
}

    Rufen Sie anschließend die aufgelöste Daten, die von der Komponente:

    @Component({ ... })
export class MyComponent {

  constructor(private route: ActivatedRoute) { }

  ngOnInit() {
    const foo = this.route.snapshot.data['foo'];
    const bar = this.route.snapshot.data['bar'];
  }

}

    Die route nicht aktiviert werden, bis ALLE aufgelöst sind abgeschlossen/erfüllt.

    Also das ist gut zu wissen, für sicher, aber ich glaube nicht, dass es durchaus Antworten, die seine gesamte Frage. Wir erstellen x Anzahl der injizierbaren resolver-Klassen für die einzelnen beheben, wollen wir in einem Weg oder wie gehen wir nun über eine einzige Auflösung, die machen würde, mehrere service-Aufrufe, bevor die route aktiviert wird?
    Es ist eine design-Entscheidung, und es ist bis zu Ihnen. Eine sperrige resolver wird es weniger Mehrweg. Es sei denn, dein resolver ist gebunden an eine bestimmte route, ich denke, Komponieren mehrere flinke Resolver ist ein besserer Ansatz.
    Hallo, kann man ein root-Objekt mit einigen verschachtelten Objekt? Ich würde gerne ein Objekt mit verschachtelten Objekten statt viele Konfliktlöser.
    Die zurückgegebenen Daten durch die resolver werden können, was Sie wollen, es ist nur ein Objekt-literal. Aber es gibt keinen eingebauten Mechanismus, um die Aggregation der Daten aus mehreren resolvern in einem einzigen verschachtelten Objekts. Wahrscheinlich könnte man es manuell machen, obwohl, indem Sie mit einem "master" - resolver, der zugreift und aggregiert die Daten von anderen resolvern. Aber ich glaube wirklich nicht, dass es eine gute Idee, es macht den code weniger explizite und schwieriger zu Debuggen.

    InformationsquelleAutor

  2. 0

    Können Sie die gleichen Ergebnisse erzielen, während mit NUR EINEM RESOLVER:

    resolve(route: ActivatedRouteSnapshot,state: RouterStateSnapshot,): Observable<any> {
    let companyIdentifierTypes = this.companiesService.getCompanyIdentifierTypes();
    let mobilePrefixes = this.registrationService.getMobilePrefixes();
    let data = {companyIdentifierTypes: companyIdentifierTypes, mobilePrefixes: mobilePrefixes};
    return Observable.of(data);
}

    Holen und die aufgelöste Daten auf diese Weise:

    fetchDataBeforeViewRender() {
    let data =  this.route.snapshot.data['data'];
    if(data != null) {
        data.companyIdentifierTypes.subscribe(data => {this.identityTypeIDList = data;});
        data.mobilePrefixes.subscribe(data => {this.mobilePrefixOptions = data;});
    }
}

    stellen Sie sicher, dass der name, den der resolver korrekt!

    InformationsquelleAutor

Schreibe einen Kommentar