IIS 中的 Angular2 路由 - 刷新时出现 404 - 如何使用 HashLocationStrategy

Question

当我启动我的应用程序 (localhost/) 时，一切正常并重定向到默认路由 (localhost/welcome)。但是，当我重新加载页面时，IIS 正在寻找一个不存在的目录 Welcome，因为它只是一个虚拟路由。

我读到有两种解决方案。 1. IIS Url 重写，2. 使用 HashLocationStrategy（不知道为什么以及如何解决问题）。

很遗憾，我无法让解决方案 2 起作用：

    @NgModule({
    imports:      [ MapModule, BrowserModule, HttpModule, FormsModule, routing, DataTableModule, MdGridListModule, GrowlModule, TabMenuModule, PanelModule],
    declarations: [ Application, CellDetailComponent, WelcomeComponent, SlimLoadingBarComponent],
    bootstrap:    [ Application ],
    providers: [
        appRoutingProviders,
        AppConfig,
        { provide: APP_INITIALIZER, useFactory: (config: AppConfig) => () => config.load(), deps: [AppConfig], multi: true },
        { provide: LocationStrategy, useClass: HashLocationStrategy}
    ]
})

路线设置：

import { Routes, RouterModule } from '@angular/router';
import {CellDetailComponent} from "./components/infopanel/cell-detail.component";
import {WelcomeComponent} from "./components/infopanel/welcome.component";
import { ModuleWithProviders } from '@angular/core';

const appRoutes: Routes = [
    { path: 'welcome', component: WelcomeComponent },
    { path: 'cell/:id', component: CellDetailComponent },
    { path: '',  redirectTo: '/welcome', pathMatch: 'full'},        // default route
    { path: '**', component: WelcomeComponent }                     // PathNotFound route
];

export const appRoutingProviders: any[] = [

];

export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes);

我做错了什么？

Answer 1

刚刚找到答案：

    RouterModule.forRoot(routes, { useHash: true })

Answer 2

在 Angular 4 的最新版本中，我们没有单独的引导程序[AppComponent] 你只需要写：

RouterModule.forRoot(routes, **{ useHash: true }**)