Angular2 Router und mehrere Resolves in einer Route

Question

In ui-Router seine leicht mehrere Entschlüsse in der Route-Konfiguration definiert zu machen, wie etwas lässt so sagen:

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() 
     } 
    ] 
    } 
}]; 

wenn die Angular2 Router ist erfordert, dass Sie Implementieren eines Resolver-Musters für den Auflösungsparameter. So etwas wie folgt aus:

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 meinen Weg, den ich 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 gibt es nur eine Lösung ist es. Wie implementiert man mehrere Auflösungsargumente wie die ui-Router-Implementierung?

Ich nehme an, Sie haben 2 Möglichkeiten; Implementiere Resolver für jeden dieser Eingänge ODER lasse die Auflösung ein Objekt zurückgeben, in dem alle deine Resolver verschachtelt sind. Das erste scheint ziemlich zeremoniell und das zweite klingt ziemlich hacky, also muss es einen besseren Weg geben.

Answer 1

Okay, ich hoffe, ich habe die Frage nicht missverstanden.

Angulars Router unterstützt so viele Resolver wie Sie möchten.

In der Route Erklärung, die resolve Eigenschaft ist ein Objekt, und es kann so viele Schlüssel hat, wie Sie mögen:

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

Dann die aufgelösten Daten aus Ihrer Komponente abrufen:

@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 wird erst aktiviert, wenn ALLE Auflösungen abgeschlossen sind.