Question

更新到rc 1路由后，当url有查询字符串参数时，我的应用程序不起作用。

以下是应用程序组件中路由的定义方式：

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

这是主要组成部分：

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时，它正确地调用主要组件并且也调用routerOnActivate。但在其中，我没有得到身份证明。一旦调用ngOnInit，url就会更改为http://localhost:49191/designer，而不会显示查询字符串参数。

如何保留网址？不要让路由器改变它吗？

Answer 1

您需要像这样访问您的MainComponent：

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

请注意我如何将?替换为;

一切都应该正常。

基本上查询字符串参数不再用“？”分隔和“＆amp;”。它们以分号分隔（; ）。这称为Matrix URL notation，这是Angular 2 RC1 Router基于的工作方式。

有关详细信息，请参阅this answer。

Angular 2 rc 1路由器 - 重写网址

1 个答案: