2017-04-14 18 views
1

現在のアクティブなルートを変更せずにURLのパスパラメータを更新する方法を見つけようとしています。例えば、私は次のルートを持っていると言う:アクティブなルートを変更せずにURLパスパラメータを角2で変更する

{ 
    path: 'pages/:pageId', 
    component: PageComponent, 
    children: [ 
    { 
     path: 'sections/:sectionId', 
     component: PageSectionComponent, 
     children: [ 
     { 
      path: 'details', 
      component: PageSectionDetailsComponent 
     }] 
    }] 
} 

私が解決しようとしている問題は、誰かが:pageIdを変更したときに、ですが、私はURLを変更しながら、それらの活性のルートを維持したいです。だから、彼らは999から777に:pageIdを変更した場合、そのルートから変更する必要があります。

さらに
pages/999/sections/123/details => pages/777/sections/123/details 
pages/999/sections/123   => pages/777/sections/123 

、私は:sectionIdため、この作業をする必要があります。例えば、:sectionId 123 456からナビゲート:

pages/999/sections/123/details => pages/999/sections/456/details 
pages/999/sections/123   => pages/999/sections/456 

は、私は、そう絶対リンクを維持することは非常に困難であろう省い私のプロジェクトのいくつかの子のルートがあります。私は何とか現在のActivatedRouteを使用して、私が更新している単一のパラメータを変更し、次にRouterを使ってそのルートに移動することを望んでいます。

すべてのヘルプは大歓迎です!

追加情報:Change a single route parameter on the current route in Angular 2

私はそこに私が解決しようとしているコアの問題で取得します同様の質問だが、それは古くなっていアンギュラ4.0.0

を使用しています

答えて

2

コードまたはHTMLの中で、必要なパラメータに更新することができます。アプリケーションの中で最も意味のあるものに変更できます。 、あなたはrouterLinkディレクティブでそれを行うだろうとHTMLで

<a [routerLink]="['/products', product.id]">{{product.productName}}</a> 

またはこのようなコードを持つ:

this.router.navigate(['/products', this.product.id]); 

またはあなたの例で:

this.router.navigate(['/pages', this.pageId, '/sections', this.sectionId]); 

(私は初めてこの質問を誤解したと思う。)

+0

私はこれが私の子供のルートのすべてでうまくいくとは思わない。たとえば、 'this.router.navigate(['/ pages'、pageId、 '/ sections'、sectionId])'を実行すると、 '/ pages/999/sections/123/details'は'/pages '/ pages/777/sections/123/details'の代わりに/ 777/sections/123'を使います。私が抱えている問題は、場所の変更をハードコーディングすることなく、*全体の*アクティブなルートを維持する方法です。 – SnailCoil

+0

ルートはどのようにアクティブになっていますか?コードをどこかに投稿したり、プランナーを提供することは可能ですか? – DeborahK

+0

必要なパラメータの代わりにクエリパラメータを使用することも考えられます。つまり、ルート設定からIdを削除し、それを2つのIDを持つオブジェクトであるクエリパラメータのセットとして渡すだけです。 – DeborahK

関連する問題