Come supporto RouteParams alla ricarica della pagina usando Angular 2 Dart?

Question

Sto usando il router e RouteParams in Angular 2 Dart.

miei percorsi sono i seguenti:

@RouteConfig(const [ 
    const Route(path: '/', component: ViewLanding, as: 'home'), 
    const Route(path: '/landing', component: ViewLanding, as: 'landing'), 
    const Route(path: '/flights', component: ViewFlights, as: 'flights'), 
    const Route(path: '/picker/:cityDepart/:cityArrival/:dateDepart/:dateArrival/', component: ViewFlights, as: 'picker'), 
    const Route(path: '/order/:id/:level/:dateDepart/:dateArrival/', component: ViewOrder, as: 'order'), 
    const Route(path: '/order/complete', component: ViewComplete, as: 'orderComplete') 
]) 

// Applicazione Punto di ingresso:

void main() { 
    print('-- Main.dart 2 --'); 
    bootstrap(Tickets, [ 
    routerInjectables, 
    client_classes, 
    // The base path of your application 
    bind(APP_BASE_HREF).toValue('/'), 
    // uncomment this if you want to use '#' in your url 
    bind(LocationStrategy).toClass(HashLocationStrategy) 
    ]); 
} 

Questo funziona bene con il router-outlet/router-Link/router.navigate

Tuttavia , alla pagina ricarica - Non ho una corrispondenza positiva per le rotte con parametri. IE: se aggiorno http://localhost:8080/#/picker/SAN/SFO/2015-01-01/2015-04-02 - Vado a una vista genitore senza percorsi figlio. Questo sintomo è vero per qualsiasi percorso con parametri.

Navigazione direttamente o rinfrescante per: http://localhost:8080/#/flights/ - funziona come previsto - la componente ViewFlights viene creata un'istanza

Sintomi: di instradamento con params fallisce.

Domanda: Come faccio a definire configurazioni percorso di lavorare con parametri di aggiornamento

vicini: https://github.com/rightisleft/web_apps_dart/blob/angular2/web/main.dart https://github.com/rightisleft/web_apps_dart/blob/angular2/lib/client/tickets.dart

Answer 1

Se ho capito bene la tua domanda, è necessario abbonarsi al eventi del router nel componente per aggiornare i vecchi parametri con nuovi, quindi aggiornare l'interfaccia utente.

Suppongo che il problema si verifichi quando si apre un URL http://localhost:8080/#/picker/SAN/SFO/2015-01-01/2015-04-02 e quindi si passa a http://localhost:8080/#/picker/SAN/SFO. Quello che fai è cambiare il percorso, ma il componente è già istanziato, il che significa che il nuovo parametro non verrà aggiornato (né rimosso). Quello che faccio di solito è la seguente nel componente genitore

angolare 5

constructor(private router:Router){ 
// Subscribe to the router events. 
// It may be a good idea to assign this subscription to a variable, and then do an unsubscribe in your ngOnDestroy(). 
this.router.events.subscribe(event=>{ 
    if(event instanceof ActivationEnd){ 
    var cityDepart = event.snapshot.params["cityDepart"]; 
    var cityArrival = event.snapshot.params["cityArrival"]; 
    var dateDepart = event.snapshot.params["dateDepart"]; 
    var dateArrival = event.snapshot.params["dateArrival"]; 
    // do some logic 
    } 
}); 
}