标签:
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() { } }
[Angular2 Router] Use Params from Angular 2 Routes Inside of Components
标签:
原文地址:http://www.cnblogs.com/Answer1215/p/5907782.html