Могу ли я добавить трубы к существующей наблюдаемой

Question

Я хочу, чтобы функция init управляла процессом инициализации кода для удобства чтения - своего рода дорожная карта.

myObservable$;

init() {
  this.watchChanges()
  this.updateOptionsOnChange()
  this.patchValuesOnOptionUpdate();
}

watchChanges () {
  myObservable$ = this.something.pipe(
    mergeMap(change => hitApi)
  )
}

updateOptionsOnChange() {
  //here I want to "Add" a pipe to the existing pipes above
  myObservable$.pipe(
    tap(add values to an object/array)
  )
}

this.patchValuesOnChanges() {
  myObservable$.subscribe(
    set values based on above tap ^
  )
};

Могу ли я сделать это, не делая другую наблюдаемую в updateOptionsOnChange.Это просто анти-паттерн для начала?

Answer 1

Вы могли бы сделать myObservable$ = myObservable$.pipe(tap(add values to an object/array)).Нет способа изменить существующий конвейер Observable «на месте», как вы описываете.

Возможно, было бы более «реактивным» иметь два разных Observable, которые вы затем объедините вместе в patchValuesOnChanges,где один из наблюдаемых источников взят из updateOptionsOnChange.

Answer 2

Используйте switchMap на BehaviorSubject для переключения с наблюдаемой, которую вы хотите использовать.

const { BehaviorSubject, interval } = rxjs;
const { switchMap, map } = rxjs.operators;

let useApi$ = new BehaviorSubject(false);

let switchButton = document.getElementById('switch');

switchButton.addEventListener('click', () => {
  if (useApi$.value) {
    switchButton.innerText = 'Local';
    useApi$.next(false);
  } else {
    switchButton.innerText = 'API';
    useApi$.next(true);
  }
});

let local$ = interval(1000).pipe(map(_ => 'local'));
let api$ = interval(1000).pipe(map(_ => 'api'));

let myObservable$ = useApi$.pipe(
  switchMap(useApi => useApi ? api$ : local$)
);

myObservable$.subscribe(val => { console.log(val); });

<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/6.5.3/rxjs.umd.min.js"></script>
<button id="switch">Local</button>