2016-11-23 5 views
3

:このURLにリンクされているコンポーネントでAngular2:私のURLはどのようにクエリのparamsを取得する行列表記で

http://localhost/#/foo;nb=25;page=1 

、私は:

ngOnInit() { 
     this.queryParamSub = this._route.queryParams.subscribe(queryParams => { 
      console.log(queryParams) 
     }) 
} 

しかし、私は空のオブジェクトを取得しておきますqueryParamsとなります。私は私のURLを試してみた:http://localhost/#/foo?nb=25&page=1それは正常に働いた。任意のアイデア行列の表記法を使用したい場合はどのように私はこの問題を解決することができますか?

EDITのthis._routeはActivatedRoute

EDITはここにある私は、クエリparamはルート経路上HomepageComponent

答えて

2

クエリパラメータがあるで取得しようとした私のapp-routing.module.ts

@NgModule({ 
    imports: [ 
     RouterModule.forChild([ 
      { 
       path: "", 
       component: AppComponent, 
       children: [ 
        { 
         path: "foo", 
         component: HomepageComponent, 
         data: { 
          name: 'home' 
         } 
        } 
       ] 
      }] 
     ) 
    ], 
    exports: [ 
     RouterModule 
    ] 
}) 

export class AppRoutingModule {} 

コンポーネントですクエリパラメータ?xxx=yyyとしてシリアル化され、子ルートのクエリパラメータは、行列パラメータ;xxx=yyyとしてシリアル化されます。

それでは、パラメータを子ルートセグメントに追加して、それらを行列表記にする必要があります。

+0

申し訳ありませんが、私はあなたが「子供のルートセグメントにそれらを追加する」ということを意味していないのではないかと思います... – Scipion

+0

ルート{ルート:あなたは 'http:// 'を取得する必要があります:'子'、コンポーネント:子}}} 'と' this.router.navigate(['/ root'、{nb:25}、 'child'、{page:1}/localhost /#/ root/child; page = 1?nb = 25'(https://angular.io/docs/ts/latest/guide/router.html#!#optional-route-parametersの最後にあります) –

+0

申し訳ありませんが、あなたの質問を誤解しているようです。マトリックスパラメータがいつ使用されるかを説明する私の答えに加えて、右のコンポーネント、つまりマトリックスパラメータが属するルートによって追加されたコンポーネントで '_route.queryParams.subscribe()'を適用する必要があります。あなたが提出したURLが実際に有効かどうかはわかりません。このURLはルータによってAngularから作成されましたか、それとも作成しましたか? –

関連する問題