目前我正在玩angular2路由.每件事都按预期工作,但在浏览器中手动输入路线网址是行不通的.
我正在使用的当前代码
app.ts
import {Component} from 'angular2/core'; import {Route,RouteConfig,ROUTER_DIRECTIVES,ROUTER_PROVIDERS} from "angular2/router"; import {DashboardComponent} from "./dashboard/dashboard.component"; import {UsersComponent} from "./user/users.component"; @Component({ selector:'app',template:` <h1>{{title}}</h1> <nav> <a [routerLink]="['Dashboard']">Dashboard</a> <a [routerLink]="['Users']">Users</a> </nav> <router-outlet></router-outlet> `,directives:[ROUTER_DIRECTIVES],providers:[ROUTER_PROVIDERS] }) @RouteConfig([ new Route({ path:'/dashboard',component:DashboardComponent,name:'Dashboard',useAsDefault:true }),new Route({ path:'/users',component:UsersComponent,name:'Users' }) ]) export class App{ }
boot.ts
import {bootstrap} from 'angular2/platform/browser'; import {App} from "./app"; import {HashLocationStrategy} from "angular2/router"; import {LocationStrategy} from "angular2/router"; import {ROUTER_PROVIDERS} from "angular2/router"; import {provide} from "angular2/core"; bootstrap(App,[ ROUTER_PROVIDERS,provide(LocationStrategy,{useClass: HashLocationStrategy}) ]);
使用锚标签的路由工作完全正常,但是当我在浏览器中手动键入相同的URL(http://localhost:3000/users或http://localhost:3000/dashboard)并点击输入时说
Cannot GET /users or Cannot GET /dashboard
请建议我如何检测浏览器的位置URL更改以匹配路径段(/ users或/ dashboard)并激活相应的Component(或UsersComponent或DashboardComponent)并显示其视图.
解决方法
这是正常的,因为默认情况下,HTML5历史记录用于使用Angular2进行路由.您需要服务器配置将所有路由重定向到HTML条目文件.
你可以看看这个答案:
> Angular 2 : 404 error occur when i refresh through Browser