手動粘貼URL時無法加載文件Angular 2路由？

我使這個路由配置手動粘貼URL時無法加載文件Angular 2路由？

@RouteConfig([ 
    { 
    path:'/profile/:id',name:'Profile',component:ProfileComponent 
    }, 
    // else 
    { 
    path: '/**', 
    redirectTo: ['Home'] 
    } 
])

和使用該導航資料與參數{ID：5}

<a [routerLink]="['Profile', {id:5}]" >Go </a>

我加入的index.html頭此基礎

<base href="/">

成功導航到

http://localhost:3000/profile/1

和工作的罰款

但是當我貼上相同的URL手冊中的瀏覽器和命中進入它給我這個錯誤

錯誤會發生，因爲文件並沒有從加載根目錄

http://localhost:3000

但瀏覽器試圖加載它們形成相對URL目錄

http://localhost:3000/profile/1

來源

2016-09-16 Amr Abdulaziz Ibrahim

我加入#我的路線，例如http://localhost:3000/#/profile/1解決了這個問題，你可以嘗試這樣做。儘管如此，有人可能會更好地解決這個問題。總之，我的解決辦法是增加HashLocationStrategy到AppModule提供商：

{ provide: LocationStrategy, useClass: HashLocationStrategy }

當然，在這之前，你需要導入LocationStrategy和HashLocationStrategy：如果您使用的RC4或更低

import { LocationStrategy, HashLocationStrategy } from '@angular/common';

，添加此例如：

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

來源

2016-09-16 17:55:31

在那裏我可以添加此 {提供：LocationStrategy，useClass：HashLocationStrategy} –

確定在bootstrap –

@amrabdulaziz我盡力解釋，不能做得比這更好。 –

這很簡單。

當刷新或手動在地址欄中複製粘貼URL，你需要有服務器端的配置（可能是服務器端的路由）（與PathLocationStrategy）確定並重定向到目標頁面。

角路由是在客戶端，如果你想要做同樣的工作狀態，你需要使用HashLocationStrategy

來源

2016-09-16 18:14:30 micronyks

感謝您的好解釋 –

歡迎您！ – micronyks

手動粘貼URL時無法加載文件Angular 2路由？

回答

相關問題