угловой 2 не найти маршрут при обновлении

Question

У меня есть простое приложение, соответствующее angular 2 quickstart. Он корректно работает на Lite-сервере. Теперь я пытаюсь запустить такое же приложение, установленное в apache под htdocs/foo, но после обновления я получаю «Object not found».

baseHref
index.html:

<base href="/foo"> 

маршрутизации
app.rounting.ts:

const appRoutes: Routes = [ 
    { 
    path: 'sched', 
    component: ScheduleFormComponent 
    }, 
    { 
    path: 'dashboard', 
    component: DashboardComponent 
    }, 
    { 
    path: '', 
    redirectTo: '/home', 
    pathMatch: 'full' 
    }, 
    { 
    path: 'home', 
    component: HomeComponent 
    }, 
    { 
    path: 'sched-detail/:id', 
    component: ConsultationDetailComponent 
    } 
]; 

Я также добавил .htaccess с помощью

<ifModule mod_rewrite.c> 
    Options +FollowSymLinks 
    IndexIgnore */* 
    RewriteEngine On 
    RewriteCond %{REQUEST_FILENAME} !-f 
    RewriteCond %{REQUEST_FILENAME} !-d 
    RewriteRule (.*) index.html 
</ifModule> 

Но все равно не повезло.

Есть ли что-то, отсутствующее в конфигурации apache?

Answer 1

У меня была такая же проблема, я решил его с помощью HashLocationStrategy

Так что в моем app.module.ts

import { NgModule } from '@angular/core'; 
import { BrowserModule } from '@angular/platform-browser'; 
import { FormsModule } from '@angular/forms'; 
import { HttpModule }  from '@angular/http'; 
import { HashLocationStrategy, LocationStrategy } from '@angular/common'; 

import { AppComponent } from './app.component'; 
import { MyComp1 } from './comp1/comp1.component'; 
import { MyComp2 } from './comp2/comp2.component'; 
import { routing } from './app.routing'; 

import 'rxjs/Rx'; 


@NgModule({ 
    imports: [ 
     BrowserModule, 
     FormsModule, 
     HttpModule, 
     routing 
    ], 
    declarations: [ 
     AppComponent, 
     MyComp1, 
     MyComp2 
    ], 
    providers: [ {provide: LocationStrategy, useClass: HashLocationStrategy} ], 
    bootstrap: [AppComponent], 
}) 
export class AppModule { } 

Тогда мой app.routing.ts выглядит следующим образом

import { Routes, RouterModule } from '@angular/router'; 

import { MyComp1 } from './comp1/comp1.component'; 
import { MyComp2 } from './comp2/comp2.component'; 

const appRoutes: Routes = [ 
    { 
     path: '', 
     redirectTo: 'mycomp1', 
     pathMatch: 'full' 
    }, 
    { 
     path: 'mycomp1', 
     component: MyComp1 
    }, 
    { 
     path: 'mycomp2/:id', 
     component: MyComp2 
    }, 
    { path: '**', redirectTo: 'mycomp1', } 
]; 

export const routing = RouterModule.forRoot(appRoutes); 

Перед HashLocationStrategy, я бы нужно перейти в «домашний», aka MyComp1, маршрут, обновить страницу, а затем перейти к той, которую я хотел обновить MyComp2, но нет w Я могу обновиться с любого из моих маршрутов, и он загружается отлично.

Также я перейти к маршрутам с использованием routerLink

<a routerLink="/mycomp1" routerLinkActive="active">My Comp1</a> 
<a [routerLink]="['mycomp2', myObj.id]" routerLinkActive="active">My Comp2</a>