Question

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

我读到有两个解决方案。 1. IIS Url Rewrite，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

在角度4的最新版本中，我们没有单独的bootstrap [AppComponent] 你只需要写：

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

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

2 个答案: