如何在angular2中为用户配置文件实现路由

Question

如何为用户名标记

实现此类用户个人资料路由

mydomain.com/mark

以及如何在组件中获取用户名'mark'的值？

要实现此目的的任何示例代码吗？

[带示例的修改问题]

Answer 1

应用/ app.routes.ts

import { provideRouter, RouterConfig } from '@angular/router';
import { HomeComponent }  from './home.component';
import { ContactCompnent }    from './contact.component';
import {UserComponent} from './user.component';
export const routes: RouterConfig = [
  { path: '', component: HomeComponent },
  { path: 'home', component: HomeComponent },
  { path: 'contact', component: ContactCompnent },
  { path: '<user>', component: UserComponent }
];
export const APP_ROUTER_PROVIDERS = [
  provideRouter(routes)
];

<强> app.component.ts

import { Component } from '@angular/core';
import { ROUTER_DIRECTIVES } from '@angular/router';

@Component({
  selector: 'my-app',
  template: `
    <h1>Component Router</h1>
    <nav>
      <a [routerLink]="['/home']">Home</a>
      <a [routerLink]="['/contact']">Contact</a>
       <a [routerLink]="['/<user>']">user</a>
    </nav>
    <router-outlet></router-outlet>
  `,
  directives: [ROUTER_DIRECTIVES]
})

export class AppComponent { } 

点击此处查看实例，

https://plnkr.co/edit/ySW9sYyV8Ou7tQB7biyx?p=preview