Angular2路线：使用HashLocationStrategy有一个404未找到错误

这里是我的项目目录结构：Angular2路线：使用HashLocationStrategy有一个404未找到错误

--root 
    --app 
     --app.ts 
     --boot.ts 
    --index.html 
    --node_modules

这里是我的代码：

boot.ts

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

app.ts

@RouteConfig([ 
    {path: '/', name: 'root', redirectTo: ['/pageA']}, 
    {path: '/page-a', name: 'pageA', component: PageA}, 
    {path: '/page-b', name: 'pageB', component: PageB} 
])

html文件：

<head> 
    <base href="/"> 
    <script src="node_modules/angular2/bundles/router.dev.js"></script> 
    ... 
</head>

它的工作原理，但是当我看到控制台，它告诉我"http://localhost:63342/#/page-a Failed to load resource: the server responded with a status of 404 (Not Found)"

此外，当我刷新页面，它显示了“404未找到”页面。

来源

2016-02-29 Ng2-Fun

通过两种方式最后解决了这个问题，第一强烈建议采用

1.see这个职位的详细信息：Angular 2 router no base href set

<base href="/root/">

2.without设置<base href...>，我想不出理由呢。

3.从文档： https://angular.io/docs/ts/latest/guide/router.html
http://plnkr.co/edit/?p=preview

从文档注：从官方文档和示例

<script>document.write('<base href="' + document.location + '" />');</script>

获取提示

Live example note 

We have to be get tricky when we run the live example because the host service sets the application base address dynamically. That's why we replace the <base href...> with a script that writes a <base> tag on the fly to match. 
<script>document.write('<base href="' + document.location + '" />');</script> 
We should only need this trick for the live example, not production code.

来源

2016-02-29 15:23:42

我会用useAsDefault代替redirectTo：

@RouteConfig([ 
    {path: '/page-a', name: 'pageA', component: PageA, useAsDefault: true}, 
    {path: '/page-b', name: 'pageB', component: PageB} 
])

在HashLocationStrategy策略的情况下，使用是没有必要的......

来源

2016-02-29 14:34:43

我真的试图b其他方式，但有同样的错误。顺便说一句，为什么你更喜欢useAsDefault？ useAsDefault比redirectTo更好吗？ –

这允许你不写“/”的特殊/假路由... –

你使用哪个Angular2？ –

Angular2路线：使用HashLocationStrategy有一个404未找到错误

回答

相关问题