Routing 为什么路由没有'；不行？

我正在尝试通过angular2中的新路由执行向导

我的app.ts

import {Component,ViewEncapsulation} from 'angular2/core';
import {RouteConfig,ROUTER_DIRECTIVES} from 'angular2/router';
import {WizardCmp} from './wizard';
@Component({
  selector: 'my-app',
  providers: [],
  encapsulation: ViewEncapsulation.None,
   template: `
     <p>header</p>
     <router-outlet></router-outlet>
     `,
    directives: [ROUTER_DIRECTIVES]
  })
    @RouteConfig([
     { path: '/...', component:WizardCmp, as: 'Home',useAsDefault:true},
       ])
      export class App {}

从'angular2/core'导入{组件，视图封装}；
从“angular2/ROUTER”导入{RouteConfig，ROUTER_指令}；
从“./wizard”导入{WizardCmp}；
@组成部分({
选择器：“我的应用程序”，
提供者：[]，
封装：视图封装。无，
模板：`
标题

`,
指令：[路由器指令]
})
@线路图([
{路径：'/…'，组件：WizardCmp，as:'Home'，useAsDefault:true}，
])
导出类App{}

我这里只有一条三点符号的路线

wizard.ts

import {Component, View} from 'angular2/core';
import {Router,RouteConfig,ROUTER_DIRECTIVES} from 'angular2/router';
import {FirstFormCmp} from './form1';
import {SecondFormCmp} from './form2';
import {ThirdFormCmp} from './form3';
 @Component({
     selector: 'wizard'
         })
 @View({

   template: `
  <h1>wizard</h1>
  <router-outlet></router-outlet>
         `,
  directives: [...ROUTER_DIRECTIVES]
    })
  @RouteConfig([
  {path: 'first', name: 'FirstForm', component: FirstFormCmp, useAsDefault:   true},
  {path: 'second', name: 'SecondForm', component: SecondFormCmp},
  {path: 'third', name: 'ThirdForm', component: ThirdFormCmp},


 export class WizardCmp {}

从'angular2/core'导入{Component，View}；
从'angular2/Router'导入{Router，RouteConfig，Router_指令}；
从“/form1”导入{FirstFormCmp}；
从“/form2”导入{SecondFormCmp}；
从“/form3”导入{ThirdFormCmp}；
@组成部分({
选择器：“向导”
})
@看法({
模板：`
男巫
`,
指令：[……路由器指令]
})
@线路图([
{path:'first'，name:'FirstForm'，component:FirstFormCmp，useAsDefault:true}，
{路径：'second'，名称：'SecondForm'，组件：SecondFormCmp}，
{路径：'third'，名称：'ThirdForm'，组件：ThirdFormCmp}，
导出类向导CMP{}

但它并没有显示任何内容。控制台中也并没有错误。

---

这是

它正在进行小的修改

使用plunker时，您必须使用。可能是因为应用程序在

中运行，不知道确切原因。但这不是Angular2或路由器问题，而是plunker的局限性

我刚刚在引导程序中添加了

HashLocationStrategy

：

bootstrap(App, [
  ROUTER_PROVIDERS,
  provide(APP_BASE_HREF, {useValue : '/'}),
  provide(LocationStrategy, {useClass: HashLocationStrategy})
])

指向模板的链接：

<a [routerLink]="['/Wizard', 'FirstForm']">first</a>
<a [routerLink]="['/Wizard', 'SecondForm']">second</a>
<a [routerLink]="['/Wizard', 'ThirdForm']">third</a>

首先
第二
第三

---

您的代码的其余部分没有更改，可以正常工作…

谢谢。您为我节省了很多时间