Javascript 无法在路由器上获取查询参数

我在尝试使用新路由库获取查询参数时遇到问题

版本 2.0.0-rc.1

问题

routerOnActivate(curr:RouteSegment, prev?:RouteSegment, currTree?:RouteTree, prevTree?:RouteTree):void {
  console.log(curr.getParam("test"));
}

始终打印未定义的内容

另一个问题是，我的url每次都被“重置”（这就是为什么我认为curr.getParam（“test”）返回未定义的内容）

以下是我的应用程序组件和我的主页组件：

应用程序组件

import {Component} from '@angular/core';
import { Routes, ROUTER_DIRECTIVES, ROUTER_PROVIDERS, Router } from '@angular/router'
import { HomeComponent } from './home.component';

@Component({
    selector    : 'my-app',
    template : '<router-outlet></router-outlet>',
    directives  : [ ROUTER_DIRECTIVES ],
    providers   : [ ROUTER_PROVIDERS ]
})
@Routes([
    {
        path : '/',
        component : HomeComponent
    }
])
export class AppComponent {
    constructor (private _router : Router) {
    }
}

import { Component } from '@angular/core';
import { Router, OnActivate, RouteSegment } from '@angular/router';


@Component({
    selector: 'home',
    template: '<h3>THIS IS HOME</h3>'
})
export class HomeComponent implements OnActivate{
    constructor(private _router : Router) {
        console.log('Called');
    }

    routerOnActivate(curr:RouteSegment):void {
        console.log(curr.getParam("test"));
    }
}

从'@angular/core'导入{Component}；
从'@angular/ROUTER'导入{Routes，ROUTER_指令，ROUTER_提供程序，ROUTER}
从“./home.component”导入{HomeComponent}；
@组成部分({
选择器：“我的应用程序”，
模板：“”，
指令：[路由器指令]，
提供者：[路由器提供者]
})
@路线([
{
路径：“/”，
组件：HomeComponent
}
])
导出类AppComponent{
构造函数（专用路由器：路由器）{
}
}

主组件

import {Component} from '@angular/core';
import { Routes, ROUTER_DIRECTIVES, ROUTER_PROVIDERS, Router } from '@angular/router'
import { HomeComponent } from './home.component';

@Component({
    selector    : 'my-app',
    template : '<router-outlet></router-outlet>',
    directives  : [ ROUTER_DIRECTIVES ],
    providers   : [ ROUTER_PROVIDERS ]
})
@Routes([
    {
        path : '/',
        component : HomeComponent
    }
])
export class AppComponent {
    constructor (private _router : Router) {
    }
}

import { Component } from '@angular/core';
import { Router, OnActivate, RouteSegment } from '@angular/router';


@Component({
    selector: 'home',
    template: '<h3>THIS IS HOME</h3>'
})
export class HomeComponent implements OnActivate{
    constructor(private _router : Router) {
        console.log('Called');
    }

    routerOnActivate(curr:RouteSegment):void {
        console.log(curr.getParam("test"));
    }
}

从'@angular/core'导入{Component}；
从“@angular/Router”导入{Router，OnActivate，RouteSegment}；
@组成部分({
选择器：“主页”，
模板：“这是家”
})
导出类HomeComponent实现OnActivate{
构造函数（专用路由器：路由器）{
log（'Called'）；
}
路由激活（当前：路由分段）：无效{
console.log（curr.getParam（“test”）；
}
}

测试URL

localhost:3000/？test=helloworld-->更改为（问题）localhost:3000

---

有人能帮忙吗？

您的代码看起来不错，唯一的问题是：

查询字符串参数不再以“？”和“&”分隔。它们之间用分号（；）分隔，这是我们以前可能没有见过的。矩阵URL表示法是1996年提案中首次提出的想法，尽管它从未被纳入HTML标准，但它是合法的，并且在浏览器路由系统中作为一种隔离属于父路由和子路由的参数的方法而变得流行。角组件路由器就是这样一个系统

因此，您可以通过更改地址从当前RouteSegment获取可选参数（test）的值

localhost:3000/？test=helloworld

到

---

localhost:3000/；test=helloworld

URL“localhost:3000/？test=helloworld”是一个查询字符串，而不是路由。应该改为“localhost:3000/test/helloworld”。在实际应用程序中，我的参数是可选的。这就是我使用查询字符串的原因。我想我已经发现了问题所在。新的路由库似乎只支持矩阵URL表示法。所以使用localhost:3000/；test=helloworld而不是“？”和“&”应该可以解决问题。我真的不喜欢这个“新”（不是新）的符号，因为几乎每个网站都使用？及&