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未找到錯誤

回答

相關問題