Angular2ルータおよびUI-ルータには1つのルート

Question

の複数の解決resolveパラメータのリゾルバパターンを実装します。したがって、このような何か：

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

} 

その後、私のルートに私のようなものを実行します。

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

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

問題は、唯一の解決があります。 ui-router実装のように複数の解決引数を実装するにはどうすればよいですか？

2つのオプションがあるとします。これらの入力のそれぞれに対してリゾルバを実装するか、解決がすべての解決がネストされたオブジェクトを返すようにします。最初はかなり儀式的に見え、2番目の音はかなりハッキリと聞こえるので、より良い方法が必要です。

Answer 1

申し訳ありませんが、私は質問を誤解していないことを願っています。

Angularのルーターは、ルートごとに必要な数のリゾルバーをサポートします。ルート宣言で

、resolveプロパティがオブジェクトであり、あなたが好きなことはできるだけ多くのキーを持つことができます。

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

次に、あなたのコンポーネントから解決のデータを取得：

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

    constructor(private route: ActivatedRoute) { } 

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

} 

を

すべての解決が完了/完了するまで、ルートはアクティブ化されません。