Разделить подписку ActivatedRoute queryParams на несколько подписок

Question

Я хочу получить Angular ActivatedRoute queryParams, изменить и выполнить функцию только один раз и другую функцию каждый раз.

Пока что я нашел способ подписаться дважды, но я хочу лучший способ сделать это, возможно, используякакой-то pipe оператор.

// DO SOMETHING THE FIRST TIME
this.activatedRoute.queryParamMap
      .pipe(
        first(),
        switchMap(params => {
          // HTTP CALL
        })
      )
      .subscribe((data: any) => {
        // DO SOMETHING
      }); 

// DO SOMETHING ALWAYS
this.activatedRoute.queryParamMap
      .subscribe((params: any) => {
        // DO SOMETHING
      }); 

Есть ли другой способ сделать это, что-то вроде splitSubscription operator ??

Answer 1

Один подход может быть примерно таким,

visited = false;
this.activatedRoute.queryParamMap.pipe(
  tap(_ => {
    //do your always thing
  }),
  filter(_ => !this.visited),
  tap(_ => {
    this.visited = true;
    // do your one time thing
  })
).subscribe();

Вместо tap у вас может быть свой собственный набор операторов, на что следует обратить внимание, фильтрация таким образом позволит только один раз выйти из строя, и вы сможете получить одноразовую реализацию.

Answer 2

Вы можете немного изменить рефакторинг, вместо того, чтобы пытаться подписаться несколько раз на activatedRoute.queryParamMap - не уверен, что оператор расщепления, о котором вы спрашиваете, возможен. Следующий шаблон довольно стандартный

// Class properties
private paramMapSubject = new BehaviourSubject<ParamMap>(null);
// Using a public observable if your binding to components, or exposing in a service
public params$ = this.paramMapSubject.asObservable();

// In your constructor
// componentDestroyed$ is a subject that's nexted in ngOnDestroy
this.activatedRoute.queryParamMap
      .pipe(
        takeUntil(componentDestroyed$)
        tap( params => {
          this.paramMapSubject.next(params)
        }),
      )
      .subscribe();

// In ngOnInit - will only be called once - if it's in a component
this.params$.pipe(
  takeOne(),
  tap( params => {
    // Do Something Once
  }).subscribe()

this.params$.pipe(
  takeUntil(componentDestroyed$)
  tap( params => {
    // Do Something continuously
  }).subscribe()