2016-11-15 27 views
7

Próbuję hostować aplikację kątową 2 (utworzoną za pomocą kątowej cli) z Firebase, ale moje trasy nie działają.angular-cli Hosting Firebase Hosting routera Angular 2 nie działa

Stworzyłem projekt z kanciastą 2 i maszynopisem dla strony, nad którą pracuję, gdzie chcę uzyskać statyczną stronę polityki prywatności.

Kiedy wykonać

ng serve 

i przejdź do http://localhost:4200/privacy-policy w przeglądarce pojawia się zawartość spodziewam.

Oto kod zgodnie z zaleceniami kątowej 2 trasy PAGE-

@NgModule({ 
    declarations: [ 
     AppComponent, 
     HomeComponent, 
     TermsOfServiceComponent, 
     PrivacyPolicyComponent, 
     PageNotFoundComponent 
    ], 
    imports: [ 
     AlertModule, 
     BrowserModule, 
     FormsModule, 
     HttpModule, 
     RouterModule.forRoot([ 
      {path: 'privacy-policy', component: PrivacyPolicyComponent}, 
      {path: 'terms-of-service', component: TermsOfServiceComponent}, 
      {path: '', component: HomeComponent}, 
      {path: '**', component: PageNotFoundComponent} 
     ]) 
    ], 
    providers: [], 
    bootstrap: [AppComponent] 
}) 
export class AppModule { 
} 

skonfigurowałem Firebase hosting z moim projekcie Oto mój config Plik-

{ 
    "database": { 
    "rules": "database.rules.json" 
    }, 
    "hosting": { 
    "public": "dist" 
    } 
} 

Aby wdrożyć biegnę

ng build --prod 
firebase deploy 

Gdy nawiguję do: https://MY-APP.firebaseapp.com/ Aplikacja ładuje się prawidłowo dla domyślnej trasy.

Jednak gdy próbuję nawigować do https://MY-APP.firebaseapp.com/privacy-policy mam 404.

Liczyłam to działało jak to miało miejsce z ng służyć.

Każda pomoc zostanie bardzo doceniona.

Odpowiedz

11

W pliku app.module.ts wystarczy dodać następujące rzeczy:

zadeklarować

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

i dostawców Dodaj następujący

@NgModule({ 
     declarations: [...], 
     imports:[...], 
     providers:[..,{ provide: LocationStrategy, useClass: HashLocationStrategy },..] 
     ..., 
    }) 

nadzieję, że to rozwiąże problem.

I jeśli to możliwe, przechowuj swoje trasy w osobnym pliku.

Cheers

+0

Poprawiono mój problem. Aby wyjaśnić, mówisz, że w hostingu firebase używającym kątowego js muszę użyć fragmentu adresu URL dla pełnej ścieżki. https://MY-APP.firebaseapp.com/#/privacy-policy –

16

Późne odpowiedź, ale ponieważ w obliczu tego samego problemu dzisiaj kiedy wdrażane moją aplikację na Firebase, tutaj jest szybkie ustalenie dla niego:

W pliku firebase.json, aktualizacja klucz hostingowy, definiując przepisanie zasad:

 
    "hosting": { 
    "public": "dist", 
    "rewrites": [ { 
     "source": "**", 
     "destination": "/index.html" 
    } ] 
    } 
+0

To jest odpowiedź, ponieważ nie chcę używać HashLocationStrategy w mojej WebApp. Dzięki @Vlad – andreasonny83

+0

To zadziałało dla mnie. – user482594

+0

Powinna to być zaakceptowana odpowiedź: –