typescript - Angular: hur man använder pipe med Location


I Angular är Location "En tjänst som applikationer kan använda för att interagera med en webbläsares URL."

Den erbjuder en getState()-metod som tillhandahåller "det nuvarande tillståndet för platsens historik" och en subscribe()-metod så att man kan prenumerera på "plattformens popState-händelser.".

Dessa är båda användbara, men jag undrar hur jag kan komma åt observable för Location så att jag kan .pipe på den och använda några rxjs-operatörer innan jag använder .subscribe på den

Svar #1

Förmodligen inte den renaste lösningen, men eftersom Location API inte erbjuder något, varför inte:

Prenumerera på routern, mappa till platsstatus:

  ngOnInit() {
    const stateObservable = this.router.events.pipe(
      filter(event => event instanceof NavigationEnd),
      map(() => this.location.getState())
    );
  }

Svar #2

Angular-biblioteket exponerar inte privata interna _subject som en observerbar av Location-klassen.

Som en lösning kan du skapa en hjälpfunktion för att sprida resultatet av subscribe()-metoden till Observable:

import { Location, PopStateEvent } from '@angular/common';
...
const locationToObservable = (location: Location) =>
    new Observable((observer: Observer<PopStateEvent>) => 
         location.subscribe(state => observer.next(state)));

Användning :

constructor(private location: Location) {
  locationToObservable(location).pipe(map(state => ...))
}