2016-05-19 5 views
1

rc 1ルーティングに更新した後、urlにクエリ文字列パラメータがある場合、私のアプリケーションは動作しません。 、私はこのようなURLを持っているときに問題がある角2 rc 1ルータ - URLを書き換えます

import {Component, OnInit, OnDestroy, Input, ChangeDetectorRef} from "@angular/core"; 
import {OnActivate, Router, RouteSegment} from "@angular/router"; 
@Component({ 
    selector: "my-main", 
    templateUrl: "main.html" 
}) 
export class MainComponent implements OnInit, OnDestroy, OnActivate { 
    constructor(private router: Router){} 
    routerOnActivate(curr: RouteSegment) : void { 
     let id = curr.getParam("designId"); 
    } 
    ngOnInit() {} 
} 

http://localhost:49191/designer?designId=100

import {Component, OnInit, OnDestroy } from '@angular/core'; 
import {ROUTER_PROVIDERS, Routes, Router, ROUTER_DIRECTIVES} from '@angular/router'; 
@Component({ selector: 'my-app', 
    providers:[ROUTER_PROVIDERS], 
    template: 
    ` 
     <router-outlet></router-outlet> 
    ` 
    , directives: [ROUTER_DIRECTIVES] 
}) 
@Routes([ 
    {path:'/designer',    component: MainComponent}, 
    {path:'/designer/designs/:id', component: SharedDesignComponent} 
]) 
export class AppComponent implements OnInit, OnDestroy { 

constructor(private router: Router){} 

ngOnInit() { 
    console.log("appComponent: Initialized"); 
} 

ngOnDestroy() { } 
} 

そしてここでは、主成分である:ここでは

はルートがアプリケーションのコンポーネントで定義されている方法ですメインコンポーネントを正しく呼び出し、routerOnActivateも呼び出されます。しかし、それの中で、私はIDを取得しません。 ngOnInitが呼び出されるとすぐに、URLはクエリ文字列パラメータなしでhttp://localhost:49191/designerに変更されます。

どのようにURLを保持しますか?それはルータによって変更させてはいけませんか?

答えて

1

あなたはこのようなあなたのMainComponentにアクセスする必要があります:私は;

?を交換し、すべてが正常に動作する必要がありますか

http://localhost:49191/designer;designId=100 

注意してください。

基本的に、クエリ文字列パラメータは "?"で区切られません。 「&」となります。それらはセミコロンで区切られています(;)。これはMatrix URL notationと呼ばれ、Angular 2 RC1 Routerの方法に基づいています。

詳細については、this answerを参照してください。

+0

私のアプリがMVCアプリケーションに存在するため、このように動作しませんでした。私にページが見つかりませんでした。しかし、これを特別な '/#/' http:// localhost:49191/designer /#/; designId = 100で試してみると、アプリケーションを正しく呼び出すことができますが、もう一度同じ問題があります。 idは未定義で、routerOnActivate()の呼び出し後にurlが書き換えられます –

+0

アプリケーションが単独で実行される場合、これを回答として受け入れます。 MVCアプリケーションの中で動く私のアプリケーションのために、私はmvcへのルートを次のように自分のアプリケーションに追加するために追加しました:http:// localhost:49191/designer/100そして、上記のコードでうまくいきました。 –