32 lines
1.0 KiB
TypeScript

import { Component } from '@angular/core';
import { RouteConfig, ROUTER_DIRECTIVES } from '@angular/router-deprecated';
import { HeroesComponent } from './heroes.component';
import { HeroDetailComponent } from './hero-detail.component';
import { DashboardComponent } from './dashboard.component';
import { HeroService } from './hero.service';
@Component({
selector: 'my-app',
template: `
<h1>{{title}}</h1>
<nav>
<a [routerLink]="['Dashboard']">Dashboard</a>
<a [routerLink]="['Heroes']">Heroes</a>
</nav>
<router-outlet></router-outlet>
`,
styleUrls: ['app/app.component.css'],
directives: [ROUTER_DIRECTIVES],
providers: [HeroService]
})
@RouteConfig([
// {path: '/', redirectTo: ['Dashboard'] },
{path: '/dashboard', name: 'Dashboard', component: DashboardComponent, useAsDefault: true},
{path: '/heroes', name: 'Heroes', component: HeroesComponent},
{path: '/detail/:id', name: 'HeroDetail', component: HeroDetailComponent}
])
export class AppComponent {
title = 'Tour of Heroes';
}