Winkel Route paramMap switchMap nicht mehr funktioniert nach 404

Question

In meiner Komponente ngOnInit, ich paramMap bin mit wie in den documentation vorgeschlagen, um eine Komponente wiederverwenden, sondern schalt basierend auf dem Benutzer-ID in der Route zur Verfügung gestellt:

this.route.paramMap 
     .switchMap((params: ParamMap) => { 
      this.errors = false; 
      this.busy = true; 
      return this.userService.getUser(params.get('id')); 
     }) 
     .subscribe((user) => { 
      this.busy = false; 
      this.errors = false; 
      // do something with user object... 
      }, (error) => { 
      this.busy = false; 
      this.errors = true; 
      if (error.status === 404) { 
       this.errorMsg = 'User not found'; 
      } 
     }); 

Sobald jedoch die Methode userService.getUser() einen 404-Fehler auslöst, beendet .switchMap() den Brennvorgang, wenn sich die Route-Parameter ändern, z. B. zu einer neuen Benutzer-ID. Ich habe versucht, .catch() sowohl in den Dienst als auch in die Komponente zu werfen, aber es scheint keine Wirkung zu haben, und es funktioniert immer noch nach einem 404. Gehe ich das falsch?

Answer 1

ich hatte das gleiche Problem, obwohl ich sich nur auslösen, wenn das activatedRoute Observablen melde mich an, damit ich diesen

router.events.subscribe(event:Event => { 
 
    if(event instanceof NavigationEnd) { 
 
    // your route code here 
 
    this.route.paramMap 
 
     .switchMap((params: ParamMap) => { 
 
      this.errors = false; 
 
      this.busy = true; 
 
      return this.userService.getUser(params.get('id')); 
 
     }) 
 
     .subscribe((user) => { 
 
      this.busy = false; 
 
      this.errors = false; 
 
      // do something with user object... 
 
      }, (error) => { 
 
      this.busy = false; 
 
      this.errors = true; 
 
      if (error.status === 404) { 
 
       this.errorMsg = 'User not found'; 
 
      } 
 
     }); 
 
    } 
 
    })

Answer 2

Hinweis zu tun haben - ich habe gerade angefangen mit kantigem einer Arbeits vor ein paar Monaten.

Ich denke jedoch, das folgende wird Ihr Problem beheben (Ich denke, der ganze Sinn der Verwendung von Switchmap ist das Entfernen der Abonnenten).

Versuchen Sie Folgendes:

user$: Observable<user>; 
 

 
user$ = this.route.paramMap 
 
     .switchMap(params => { 
 
      this.errors = false; 
 
      this.busy = true; 
 
      return this.userService.getUser(params.get('id')); 
 
     }) 
 
     .do(next => { 
 
      this.busy = false; 
 
      this.errors = false; 
 
      // do something with user object... 
 
      }) 
 
     .catch(error => { 
 
      this.busy = false; 
 
      this.errors = true; 
 
      if (error.status === 404) { 
 
       this.errorMsg = 'User not found'; 
 
      } 
 
      return Observable.of(null); 
 
     });

Dann in Ihrer Vorlage, verwenden Sie das Asynchron-Rohr wie folgt aus:

(user$ | async) as user 

Die "als Benutzer" sein kann optional, abhängig von Ihrem Anwendungsfall.

Hoffe, das hilft.

Answer 3

Ich hatte das selbe Problem während der Arbeit an der Angular Heroes App, Problem wurde gelöst, indem der switchMap Operator importiert wurde.

import 'rxjs/add/operator/switchMap';