2016-04-15 24 views
0

Betrachten Sie den folgenden Pfad;Dynamische Routenauflösung in Angular2

/items/:id 

Diese eine Ansicht eines bestimmten Elements bezeichnet, jedoch werden die Elementtypen zur Laufzeit nicht bekannt, und werden als polymorphe Gruppe von Objekten, zum Beispiel diente;

  • /Produkte/1 - Item Typ A
  • /Produkte/2 - Item Type B
  • /Produkte/3 - Item Typ A
  • etc ...

Jeder item kann je nach Elementtyp einen anderen Satz von untergeordneten Routings haben, der sich in der Pfadstruktur unterscheidet;

/items/1/object_in_type_A/:objectId/foo 
/items/2/foo/different_path_in_B 

Bisher habe ich beschlossen, auf die Top-Level-Router als nicht-Abschluss Route zu konfigurieren, was ist im Grunde ein Wrapper-Komponente. Wenn die Wrapper-Komponente geladen wird, fordert sie ein Modell für das Element aus dem Dienst an und bestimmt anhand dieser Informationen, um welchen Typ von Unterobjekt es sich handelt. Von dort aus wird die entsprechende Komponente gesucht und mit DynamicComponentLoader gerendert. Die Komponente nimmt dann das Routing wieder auf, sobald die entsprechende Komponente geladen ist.

Ich habe jedoch meine Zweifel, ob dies der richtige Ansatz ist, und möchte das Konzept des Routings in einem Laufzeit-evaluierten Szenario wie diesem verstehen, oder ob es sogar der richtige Ansatz ist.

+0

Dies gilt nicht Ihre Frage beantworten, aber Sie sollten Besuche [NGRX/Router] (https://github.com/ngrx/router), speziell von unten nach oben zu diesem Zweck – drewmoore

+0

Wenn Items Typen unterschiedliche Komponenten sind, dann definiert jeder seine eigenen Subrouten – Chandermani

+0

Ich denke, was ich versuche herauszufinden ist, ob eine Route/URL in Stufen bewertet werden kann. Betrachten Sie das erste Beispiel '/ items/1/objects/123/foo'. Gibt es eine Möglichkeit, 'items/1' auszuwerten, und wenn die Instanz einmal instanziiert ist, die nächste Routenstufe,' objects/123/foo', weitergeben? –

Antwort

0

Im neuen Router (>= RC.3) https://angular.io/docs/ts/latest/api/router/index/Router-interface.html#!#resetConfig-anchorresetConfig kann

router.resetConfig([ 
{ path: 'team/:id', component: TeamCmp, children: [ 
    { path: 'simple', component: SimpleCmp }, 
    { path: 'user/:name', component: UserCmp } 
] } 
]); 

Auf diese Weise verwendet werden, können Sie mehr Daten vom Server laden und den Router jederzeit neu konfigurieren.

Lazy Laden von Komponenten ist soweit ich weiß noch in Arbeit.

https://github.com/angular/angular/issues/11437#issuecomment-245995186 bietet eine RC.6 Plunker

Verwandte Themen