[英]How to get Route Params in Angular2 rc5?
I am getting a simple parameter via the router, using Angular2 RC5. 我正在使用Angular2 RC5通过路由器获得一个简单的参数。 The parameter is just a name. 该参数只是一个名称。 In app.routes.ts, I set the route parameter to "directory/:ninja". 在app.routes.ts中,我将路由参数设置为“ directory /:ninja”。
app.routes.ts app.routes.ts
import { Routes, RouterModule } from "@angular/router";
import { DirectoryComponent } from "./directory/directory.component";
import { HomeComponent } from "./home/home.component";
const APP_ROUTES: Routes = [
{ path: 'directory/:ninja', component: DirectoryComponent },
{ path: '', component: HomeComponent }
];
export const APP_ROUTES_PROVIDER = RouterModule.forRoot(APP_ROUTES);
directory.component.ts directory.component.ts
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
@Component({
selector: 'app-directory',
templateUrl: './directory.component.html',
styleUrls: ['./directory.component.css']
})
export class DirectoryComponent implements OnInit {
ninja: string;
constructor(public route: ActivatedRoute) {
this.ninja = route.snapshot.params['ninja'];
}
ngOnInit() {
}
}
directory.component.html directory.component.html
{{ninja}}
Whenever I access http://localhost:4200/directory/richard , it redirects me to the ROOT URL. 每当我访问http:// localhost:4200 / directory / richard时 ,它就会将我重定向到ROOT URL。 Richard is the name of the ninja. 理查德是忍者的名字。
It should display the name of the ninja in directory.component.ts 它应该在directory.component.ts中显示忍者的名称
1) Import 1)导入
import {ActivatedRoute} from '@angular/router';
2) Constructor 2)构造函数
constructor(private route:ActivatedRoute,.......
3) Subscribe 3)订阅
this.route.params.subscribe(params => {
console.log('Param whatever: ', params['whatever']);
this.whatever = params['whatever'];
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.