Angular 2 rc1 中的 RouteParams
RouteParams in Angular 2 rc1
我一直在试用 Angular 2 自 beta 版以来,现在有了 rc.0+,一些事情发生了变化。
其中之一是无法从@angular/router 导入的 RouteParams。当我尝试使用 @angular/router-deprecated 时,我收到一条错误消息:
ORIGINAL EXCEPTION: No provider for RouteParams!
app.component:
@Routes([
{ path: '/', component: StartComponent },
{path: '/:projId/:userName', component: ProjectListComponent},
{ path: '*', component: StartComponent },
])
项目-list.component:
import {Component, OnInit} from '@angular/core';
import {RouteParams} from '@angular/router-deprecated';
@Component({
...
})
export class ProjectListComponent implements OnInit {
userName:string;
projId:string;
constructor(private params:RouteParams) {
this.userName = params.get('userName');
this.projId = params.get('projId');
}
}
我现在在哪里可以导入 RouteParams,还是我做错了什么?
谢谢!
一种方法是
routerOnActivate(curr: RouteSegment) {
this.userName = curr.getParam('userName');
this.projId = curr.getParam('projId');
}
你必须使用 RouteSegment
而不是在 angular2 RC 中使用 RouteParams
。像这样:-
import { Component } from '@angular/core';
import { Routes, RouteSegment, ROUTER_DIRECTIVES } from '@angular/router';
@Component({
selector: 'about-item',
template: `<h3>About Item Id: {{id}}</h3>`
})
class AboutItemComponent {
id: any;
constructor(routeSegment: RouteSegment) {
this.id = routeSegment.getParam('id');
}
}
@Component({
selector: 'app-about',
template: `
<h2>About</h2>
<a [routerLink]="['/about/item', 1]">Item 1</a>
<a [routerLink]="['/about/item', 2]">Item 2</a>
<div class="inner-outlet">
<router-outlet></router-outlet>
</div>
`,
directives: [ROUTER_DIRECTIVES]
})
@Routes([
{ path: '/item/:id', component: AboutItemComponent }
])
export class AboutComponent { }
我一直在试用 Angular 2 自 beta 版以来,现在有了 rc.0+,一些事情发生了变化。
其中之一是无法从@angular/router 导入的 RouteParams。当我尝试使用 @angular/router-deprecated 时,我收到一条错误消息:
ORIGINAL EXCEPTION: No provider for RouteParams!
app.component:
@Routes([
{ path: '/', component: StartComponent },
{path: '/:projId/:userName', component: ProjectListComponent},
{ path: '*', component: StartComponent },
])
项目-list.component:
import {Component, OnInit} from '@angular/core';
import {RouteParams} from '@angular/router-deprecated';
@Component({
...
})
export class ProjectListComponent implements OnInit {
userName:string;
projId:string;
constructor(private params:RouteParams) {
this.userName = params.get('userName');
this.projId = params.get('projId');
}
}
我现在在哪里可以导入 RouteParams,还是我做错了什么?
谢谢!
一种方法是
routerOnActivate(curr: RouteSegment) {
this.userName = curr.getParam('userName');
this.projId = curr.getParam('projId');
}
你必须使用 RouteSegment
而不是在 angular2 RC 中使用 RouteParams
。像这样:-
import { Component } from '@angular/core';
import { Routes, RouteSegment, ROUTER_DIRECTIVES } from '@angular/router';
@Component({
selector: 'about-item',
template: `<h3>About Item Id: {{id}}</h3>`
})
class AboutItemComponent {
id: any;
constructor(routeSegment: RouteSegment) {
this.id = routeSegment.getParam('id');
}
}
@Component({
selector: 'app-about',
template: `
<h2>About</h2>
<a [routerLink]="['/about/item', 1]">Item 1</a>
<a [routerLink]="['/about/item', 2]">Item 2</a>
<div class="inner-outlet">
<router-outlet></router-outlet>
</div>
`,
directives: [ROUTER_DIRECTIVES]
})
@Routes([
{ path: '/item/:id', component: AboutItemComponent }
])
export class AboutComponent { }