Winkel 2 Überprüfen Sie, ob query-parameter in der url vorhanden ist

Ich brauche, um zu überprüfen, ob die aktuelle url-query-string.

url

http://localhost:4200/test?id=55555

oder

http://localhost:4200/test

Habe ich verwendet

this.route.queryParams
     .filter(params => 'id' in params)
     .map(params => params.id)
     .distinctUntilChanged()
     .subscribe(
     id=> {
                //check lead Id here
                console.log(id);
            }
     );

Aber das funktioniert nur, wenn es die id in der url. Nicht sicher, wie Sie Sie, zu überprüfen, ob es existiert.

stackoverflow.com/questions/36318761/...

InformationsquelleAutor rishal | 2017-01-10

angular angular2-routing

1

Ich würde sagen mit:
```
ngOnInit() {
 if (this.route.snapshot.queryParams['id']) {
      //do your stuff. example: console.log('id: ', this.route.snapshot.queryParams['id']);
 }
}
```
ausreichen würde.
Vergessen Sie nicht initialisiert private route: ActivatedRoute im Konstruktor und import { ActivatedRoute } from '@angular/router';

Da Sie nur brauchen, um zu überprüfen, ob es existiert oder nicht. Wenn es nicht deine Sachen auftreten würden, wie das hinzufügen eines boolean zu prüfen, ob es eingestellt wurde oder nicht. Wenn es nicht existiert, dann kann auch nichts passieren würde. Wenn dann müssen Sie etwas tun, irgendwo anders in der Komponente, die Sie überprüfen könnten, die boolean später, wenn es war wahr/falsch, je nach dem, wie man es früher.

für Winkel-7: this.route.snapshot.queryParamsMap.get('id')

InformationsquelleAutor Mukyuu
8

Können Sie direkt überprüfen Sie es in Ihrem abonnieren-Funktion, wie unten :
```
this.route.queryParams.subscribe((params)=> {
  //check lead Id here
  if(params['id']){
    console.log(params['id']);
  } else {
    console.log('id not found in params')
  }
});
```
Problem mit diesem ist, wenn ich laden Sie zunächst die Seite, die ich erhalten id not found in params dann wird der Wert von id.
Sie können if( params.hasOwnPrperty('id') ) oder if( Object.keys(params).indexOf('id') !== -1 ) statt if(params['id'])

InformationsquelleAutor ranakrunal9

dies ist der einfache Weg :

this.route.queryParams.subscribe(
    (params: Params) => {
        if (params.hasOwnProperty('id')) { console.log(params['id']); }
    }
);

InformationsquelleAutor Amin Adel

0

Vorläufige

Wenn man abonniert, queryParams, wie unten, die variable params enthält ein Objekt, wo die Schlüssel sind alle der Abfrage-Parameter und der Wert kann entweder ein einzelner Wert oder ein array von Werten. Man kann console.log(params); zu überprüfen, das Ergebnis. Zum Beispiel:

wenn die url ist: http://example.com/?lion=10&Löwe=15&cat=20

und dann versuchen wir zu sehen, was params hält:
```
this.route.queryParams.subscribe((params) => {
    console.log(params);
});
```
das Ergebnis wäre ein Objekt, wo die Schlüssel sind lion und cat aber Werte werden in einem array für die Löwen, da hat es zwei vorkommen und für die Katze ist ein einzelner Wert:
```
{ lion: [10, 15], cat:20 }
```
Nun die Beantwortung der Frage,

Nehmen wir mal die url: http://example.com/?id&name=james

Kann man feststellen, dass es keinen Wert für id. Es ist möglich, dass eine url genau einen Schlüssel hat aber keinen Wert, und doch möchten wir wissen, dass der Schlüssel mindestens vorhanden ist. Wenn wir das zu tun:
```
if(params['id']){
    //do something
}
```
diese Bedingung wird false zurückgegeben, obwohl die Schlüssel-id vorhanden ist. Könnten wir wirklich etwas tun wollen, wenn der Schlüssel allein ist vorhanden, und etwas anderes, wenn der Schlüssel und Wert vorhanden sind. In diesem Fall können wir nutzen, lodash Bibliothek effektiv zu Sortieren Schlüssel und Schlüssel/Wert-Ergebnisse. Nach dem Import lodash Bibliothek in das Projekt. Man kann _.hat um dies zu tun:
```
//check if id key is present in params object first
if(_.has(params, 'id')) {
    if(params['id']=="") {
      //id key is present but has no value so do something
    } else {
      //id key is present and has a value as well so do something else
    }
} else {
    //since id key itself is not present do something totally different here
}
```
Natürlich der obige code wird davon ausgegangen, dass die id-Taste erscheint nur einmal in der url-params. Ansonsten müsste man eine Schleife durch ein array und überprüfen Sie jeden Wert.

was ist der Punkt, der mit der key-id in der url, aber nicht den Wert? Zu weit hergeholt für mich..

InformationsquelleAutor Sriram Ranganathan

Ich nehme an, Sie verwenden die Angular-Routing-System hier. Dann injizieren Sie die aktuellen aktivierten route im Konstruktor der Komponente wie folgt:

constructor(private activatedRoute: ActivatedRoute)

Dann prüfen Sie also Ihre ngOnInit() etwa so:

ngOnInit() {
    console.log("Hello ngOnInit");
    let token = null;
    this.activatedRoute.queryParamMap.subscribe((next : ParamMap) => {
      token = next.get("token")

      if (token) {
        console.log(token);
      } else {
        console.log("no token given in url");
      }
    });
  }

InformationsquelleAutor Rainer Feike

0

Da niemand erwähnt die Verwendung von snapshot ich bin Angabe meine Antwort. Wenn Sie nicht wirklich brauchen eine beobachtbare, d.h. die url wird geändert, sobald e.g Benutzer navigiert zu "Seite Bearbeiten") können Sie die Vorteile der Snapshot-alternative, die ist viel kürzer. So, in Ihrer app, die Sie tun könnten:
```
constructor(private route: ActivatedRoute) {

}

ngOnInit(): void { 
    if (this.route.snapshot.params['id']) {
        //id exists, so do something with it.

    }
}
```
Aber nehmen Sie in mind dieser Stelle:

Denken Sie daran: Sie erhalten nur den ersten Wert des Parameters anzeigen mit
dieser Technik. Stick mit den beobachtbaren paramMap Ansatz, wenn es
sogar die chance, dass der router könnte die Wiederverwendung der Komponente. Dieses Beispiel
bleibt mit den beobachtbaren paramMap Strategie nur für den Fall.

Quelle: Snapshot: die nicht-beobachtbaren alternative

InformationsquelleAutor jpgrassi

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.