如何在Angular2 rc5中获取路由参数
How to get Route Params in Angular2 rc5?
我通过路由器获得一个简单的参数,使用Angular2 RC5。参数只是一个名称。在app.routes。在命令行中,我将路由参数设置为"directory/:ninja"。
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
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
{{ninja}}
每当我访问http://localhost:4200/directory/richard时,它都会将我重定向到ROOT URL。理查德是忍者的名字。
应该在directory.component.ts
1)导入
import {ActivatedRoute} from '@angular/router';
2)构造函数constructor(private route:ActivatedRoute,.......
3)订阅
this.route.params.subscribe(params => {
console.log('Param whatever: ', params['whatever']);
this.whatever = params['whatever'];
});
相关文章:
- 格式化获取请求的路由
- 从javascript文件中获取JSON,并使用NodeJS在路由文件中显示
- JavaScript:从具有使用 # 符号的路由的 URL 获取查询字符串
- 角度路由导致404-无法获取
- Ember.js使用Router架构获取父路由的控制器
- 使用Passport.js获取路由之外的当前用户
- 如何在JavaScript中获取路由参数
- 在节点快速路由中使用句点时获取 403
- Symfony2-从路由到控制器获取ID
- NodeJS express - 无法获取路由
- 无法获取/路由错误
- AngularJS:在模板外部获取路由解析数据
- ExpressJS无法在Openshift中获取/路由,但在本地它可以工作
- 如何在Angular2 rc5中获取路由参数
- Angular 2:如何从router-outlet外部获取路由的参数?
- 拆分路径名称以获取路由参数
- 在不传递参数的情况下从server.js获取路由到routes.js
- 流星:在页面加载时获取路由参数
- Google Maps v3 API获取路由持续时间失败
- 在actioncreator/selector中获取路由参数