2017-08-09 5 views
0

es so geht ...Abfrage params mit mehreren Schrägstriche in URL

BASE

Angular 4.2.1
Angular CLI 1.0.3

FRAGE

Ich habe eine URL-Route als path: 'shop/:shopId',

definiert

Ich habe eine shop component. In der Shop-Komponente lese ich die shopId und gebe sie an die API weiter. Alles ist gut.

ABER

Die URLs für Shop können manchmal werden smething wie folgt

  1. /shop/Frauen
  2. /shop/Frauen/Shirts
  3. /shop/Männer/titan/Uhren

Im Fall von #2 und #3 Ich bin nicht in der Lage, women/shirts und men/titan/watches als ShopId zu erhalten.

Hinweis: Ich habe keine Grenzen für die URL haben, können es bis zu 10 bis 15 Anzahl der params gehen so 10 bis 15 Routen zu definieren chaotisch wäre.

Es geht zu einer anderen URL mit 2, 3 oder 4 Slaces.

Meine Frage ist, ist es möglich, alles nach shop/ als shopId zu bekommen.

Wenn ja, wie?

Wenn nein, was könnte die Lösung sein, sollte ich separate Routen für 2, 3, 4, 5 oder 6 Anzahl von Params erstellen?

+0

Wenn Sie URLs mit mehreren solcher Segmente zu handhaben, dann sollten Sie entsprechend Routen einrichten ... Ich nehme an, Sie nicht wirklich eine Kategorie haben das heißt "titan/watches", aber das sind zwei verschiedene Kategorien, Haupt- und Unterkategorie, um damit zu beginnen - so sollten Sie Ihr System einrichten, um diese als zwei separate Werte zu erhalten; sie zu einem Ganzen zu vermischen, macht wenig Sinn. – CBroe

+0

Ich denke, Sie sollten so viele Pfade wie nötig definieren, aber alle auf dieselbe Komponente zeigen. – Ploppy

+0

@Ploppy derzeit mache ich das nur, ich habe sichergestellt, ob das, was ich dachte, möglich ist oder nicht. Danke, obwohl – Rakeschand

Antwort

1

Dies ist Ihre Route

{ 
    path: 'shop', 
    component: ShopParentComponent, 
    children : [{ 
     path: '**', 
     component: ShopComponent 
    }] 
} 

I shop als Eltern-Route und definiert eine ** Kind Route dorthin definiert haben. Child verwendet ShopComponent als Komponente und Parent verwendet ShopParentComponent.mit

_router.events.subscribe((val) => { 
    console.log(val); 
    if(val instanceof NavigationEnd) { 
     var url = this._router.url; 
     //do anything with url 
    } 
}); 

importierte Routen wie diese

Zum Beispiel bei dieser Diese erhalten Sie die aktuelle Route

import { Router, ActivatedRoute, ParamMap, NavigationStart, NavigationEnd } from '@angular/router'; 

in Ihrem ShopComponent Konstruktor Ich bin Änderungen in URL Erkennung Weg

http://localhost/shop/a/b/c/d 

es wird Sie diese URL einfach für die Nutzung geben

/shop/a/b/c/d 

Sie bearbeiten können.

fragen sich, was ist Ihre Mutterkomponente hält, nur eine

<router-outlet></router-outlet> 
+0

Danke, das funktioniert für mich. – Rakeschand

Verwandte Themen