RXJS избегает вложенных множественных подписок

Question

Я хотел бы преобразовать приведенный ниже фрагмент кода:

 this.dataUserSubscription = this.store$.pipe(select(selectUser)).subscribe(
            user => {
                this.store$.pipe(select(selectUserData, {user}), take(1))
                    .subscribe(userData => {
                        if (userData === null) {
                            this.store$.pipe(select(selectUserManagement, {user}), take(1)).subscribe(
                                userManagement => {
                                    this.store$.dispatch(saveUserDataToStore({
                                        user,
                                        userManagement
                                    }));
                                });
                        }
                    });

избегая вложенной подписки. Все примеры, которые я нашел, рассчитаны на две подписки.

 this.dataUserSubscription = this.store$.pipe(select(selectUser),
    switchMap(user => this.store$.pipe(select(selectUserData, {user}))))
    .subscription(userData => {
        // logic
    })

Но для моего примера кода это неправильное решение. Почему это правильный шаг для исправления нескольких вложенных подписок?

Answer 1

Согласно лучшим практикам RxJS, ваш второй пример - вполне приемлемый подход.

Но согласно лучшим практикам NgRx вы можете избавиться от вложенной подписки, просто объединив свои селекторы.

Трудно сказать, что делать, не видя своегоselector файлы, но если у вас уже есть user в магазине, тогда вы сможете вытащить данные пользователя из магазина без двух вызовов селектора.

Может что-то вроде:

const getDataForUser = createSelector(
    selectUser,
    selectUsers,
    (user, userDataDictionary) => userDataDictionary[user.id]
)

Тогда просто используйте тот getDataForUser селектор.