首页 > 其他 > 详细

[Angular2 Router] Use Params from Angular 2 Routes Inside of Components

时间:2016-09-26 06:27:24      阅读:434      评论:0      收藏:0      [点我收藏+]

Angular 2’s ActivatedRoute allows you to get the details of the current route into your components. Params on the ActivatedRoute are provided as streams, so you can easily map the param you want off of the stream and display it in your template.

 

For example we have a HerosComonent, and inside HerosComponent, we will have multi HeroComponent:

heros.component.html:

<ul>
  <li>
    <a [routerLink]="‘1‘"
       routerLinkActive="active"
       [routerLinkActiveOptions]="{exact: true}">Hero 1</a>
  </li>
</ul>

heros.routers.ts:

import {HerosComponent} from "./heros.component";
import {RouterModule} from "@angular/router";
import {HeroComponent} from "./hero/hero.component";
const routes = [
  {path: ‘‘, component: HerosComponent},
  {path: :id, component: HeroComponent},
];
export default RouterModule.forChild(routes)

hero.component.ts:

import { Component, OnInit } from @angular/core;
import {ActivatedRoute} from "@angular/router";

@Component({
  selector: app-hero,
  templateUrl: hero.component.html,
  styleUrls: [hero.component.css]
})
export class HeroComponent implements OnInit {

  id;
  constructor(private router: ActivatedRoute) {
    this.id = router.params.map((p:any) => p.id);
  }

  ngOnInit() {
  }

}

 

Github

[Angular2 Router] Use Params from Angular 2 Routes Inside of Components

原文:http://www.cnblogs.com/Answer1215/p/5907782.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!