2016-12-20 5 views
2

Ich baue Angular 2-Anwendung und ein kleines konzeptionelles Problem.Gefilterte Routen in Winkel 2

In meiner Anwendung habe ich eine Dashboard-Seite, die Suchleiste, Navigationsliste und einen Router-Ausgang für den Inhalt enthält. In meiner Navigationsliste habe ich mehrere Links, die einschließen:

  • Alle Artikel,
  • Meine Artikel,
  • Ausstehende Elemente ...

Wenn ich auf jedem der Links klicken I werde zu/items navigiert, was von ItemsModule und ItemsComponent gehandhabt wird. Ich habe bereits die Routen und die Links implementiert, aber ich habe Probleme damit herauszufinden, welchen Link ich benutzt habe.

Ich dachte über mehrere Möglichkeiten, es zu implementieren:

  1. Strecke mit Parametern und dann Switch-Fall innerhalb der Komponente verwenden, um zu sehen, was „Filter“ habe ich (alles/Meine/Pending).
  2. Spezifische Routenoptionen - zum Beispiel werde ich 3 Routen hinzufügen: 2.1/Artikel - alle 2.2/Artikel Elemente anzuzeigen/my - meinen Artikel 2.3/Artikel/anhängig zu zeigen - um zu zeigen, Pendenzen

Außerdem, wie ich oben erwähnt habe, habe ich eine Suchleiste, um nach einem bestimmten Gegenstand zu suchen (ob ich bei 'Alle'/'Meine'/'Pending' Gegenstände bin). Ich frage mich, wie kann ich alle Navigation und Routing kombinieren und alles zusammen arbeiten.

Lassen Sie mich wissen, wenn jemand einen Weg gefunden hat, mein Problem zu lösen.

Antwort

1

würde I 3 Pfade verwenden:

{path: 'items', component: ItemsComponent}, 
{path: 'items/:type', component: ItemsComponent}, 
{path: 'items/:type/:searchString', component: ItemsComponent} 

In der Komponente:

this._route.params.subscribe(p => { 
    var searchString = p["searchString"]; 
    switch(p["type"]) { 
     case 'all': 
     //do something 
     break; 
     case 'mine': 
     //do something 
     break; 
     case 'pending': 
     //do something 
     break; 
     default: 
     //do something 
     break; 
    } 
}