我正在运行Angular 2 beta.0而且我正在搞乱路由.这就是我所拥有的

AppComponent:

import {Component, provide} from 'angular2/core';
import {bootstrap} from 'angular2/platform/browser';
import {FORM_DIRECTIVES, CORE_DIRECTIVES} from 'angular2/common';
import {Http, Response, HTTP_PROVIDERS} from 'angular2/http';
import {RouteConfig, Location, LocationStrategy, HashLocationStrategy, ROUTER_DIRECTIVES, ROUTER_PROVIDERS} from 'angular2/router';

import {HomeComponent} from './components/home';
import {RowsComponent} from './components/rows';
import {ColumnsComponent} from './components/columns';
import {TableComponent} from './components/table';

@Component({
  selector: 'app',
  directives: [FORM_DIRECTIVES, CORE_DIRECTIVES, ROUTER_DIRECTIVES],
  templateUrl: '/app/views/root.html',
  providers: [ROUTER_PROVIDERS]
})
@RouteConfig([
  {path:'/',       name: 'Home',     component: HomeComponent},
  {path:'Rows',    name: 'Rows',     component: RowsComponent},
  {path:'Columns', name: 'Columns',  component: ColumnsComponent},
  {path:'Table',   name: 'Table',    component: TableComponent}
])
class AppComponent {
  public title = 'Responsive Layout';
  public SelectedTab = 'Home';

  constructor(location: Location) {
    //location.go('Rows');
  }
}

bootstrap(AppComponent, [
  ROUTER_PROVIDERS,
  provide(LocationStrategy, {useClass: HashLocationStrategy})
]);

每个教程和API参考似乎都指向我,就像我上面一样.我也在我的index.html的头部.这是我的RouterLinks

  

    
Home
    
Rows
    
Columns
    
Table
  

路由的行为应该如此.我没有错.当我在bootstrap导航栏中单击其中一个条目时,我看到视图已经关闭并显示正确的模板,并且它们的组件已经运行并且被绑定到.但是,尽管HashLocationStrategy在我的bootstrap(...)通话中使用,URL仍然是"HTML5风格":localhost:8080/app/Rows它应该是什么时候localhost:8080/app/#/Rows.

我相信如果我希望我的用户能够为特定视图添加书签并返回它,我需要使用旧的#based方式.如果我允许/app/Rows然后刷新页面导致404因为文件夹Rows中不存在app.

我尝试了你的代码,它的工作原理

我的代码如下:

boot.ts

import {bootstrap}    from 'angular2/platform/browser'
import {provide} from 'angular2/core';
import {AppComponent} from './app.component'
import {ROUTER_PROVIDERS, LocationStrategy, 
        HashLocationStrategy,
        PathLocationStrategy,
        APP_BASE_HREF, } from 'angular2/router'


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

-

app.ts

import {Component} from 'angular2/core';
import {RouteConfig, ROUTER_DIRECTIVES} from 'angular2/router';

@Component({
  selector:'second',
  template: `
second
`
})

export class SecondComponent{}

@Component({
   selector: 'home',
   template: `
hello
`
})

export class HomeComponent{}

@Component({
   directives : [ROUTER_DIRECTIVES],
   selector: 'my-app',
   template: 
    `home
     Second
     
    `
})


 @RouteConfig([
   {path :'/' ,name: 'Home', component: HomeComponent},
   {path :'/second', name : 'Second', component : SecondComponent}

  ])

 export class AppComponent { }

我发现你的问题,删除这一行

providers : [ROUTER_PROVIDERS]

细节我不知道为什么,当你使用ROUTERPROVIDERS两次时,也许有角度无法处理,期待有人可以帮助你