Angular2 Routing gibt 404 beim Nachladen Seite

Question

ich meine erste Angular Dart App geschrieben habe, aber etwas ist falsch Witz das Routing ...

@Component(
    selector: 'ahpmui', 
    template: ''' 
     <strong>My First Angular 2 App - {{name}}</strong> 
     <br /> 
     <router-outlet> 
     </router-outlet> 
     <br /> 
     <nav> 
      <a [routerLink]="['HomePage']">Home</a> | 
      <a [routerLink]="['DashboardPage']">Dashboard</a> 
     </nav> 
    ''', 
    directives: const [ROUTER_DIRECTIVES], 
    providers: const [ 
     ROUTER_PROVIDERS, 
     HomePage, 
     DashboardPage 
    ] 

) 
@RouteConfig(const [ 
    const Route(path: '/dashboard', component: DashboardPage, name: 'DashboardPage', useAsDefault: true), 
    const Route(path: '/home', component: HomePage, name: 'HomePage') 
]) 
class AppComponent { 

    String name = "Sample App"; 

} 

HomePage:

@Component(
    selector: 'home-page', 
    template: '<strong>This is the Home Page</strong>') 
class HomePage {} 

DashboardPage:

@Component(
    selector: 'dashboard-page', 
    template: '<strong>This is the Dashboard Page</strong>') 
class DashboardPage {} 

main.dart:

// bootstrap angular2 
    bootstrap(AppComponent, [ 
     ROUTER_PROVIDERS, 
     provide(APP_BASE_HREF, useValue: '/'), 
     provide(LocationStrategy, useClass: HashLocationStrategy) 
    ]); 

Wenn meine App startet, geht es wie erwartet auf http://localhost:8080/dashboard, wenn Sie auf den Home Link klicken, geht es korrekt zu http://localhost:8080/home. Wenn ich jetzt die Seite aktualisieren, bekomme ich einen Fehler 404

ich den Bootstrap-Teil dann auf das ändern:

// bootstrap angular2 
    bootstrap(AppComponent, [ 
     ROUTER_PROVIDERS, 
     provide(APP_BASE_HREF, useValue: '/#/'), 
     provide(LocationStrategy, useClass: HashLocationStrategy) 
    ]); 

URLs werden nun wie folgt (ich ziehe es in diesem Stil seit die Legacy-App das gleiche uRL-Format verwendet)

http://localhost:8080/#/dashboard 
http://localhost:8080/#/home 

Wenn ich refresh getroffen, nicht mehr den Fehler 404, aber die Seite umleitet zurück zum 012.342.Seite.

Ich bin mit der App pub serve

Gibt es eine Möglichkeit, in dem onHashChange Ereignisse in den Winkel Router binden kann, so dass, wenn ich http://localhost:8080/#/home aktualisieren, dass es tatsächlich Wege zum HomeComponent mit?

Answer 1

Entfernen ROUTER_PROVIDERS, von AppComponent, Sie haben sie in bootstrap() bereits. ROUTER_PROVIDERS sollte nur einmal angegeben werden.