无法通过ngrx效果正确获取firebase数据

Question

我第一次寻求你的帮助，因为我陷入了深深的麻烦。我正在使用ngrx效果将一些商店物品从firebase实时数据库加载到app init上的购物车中。作为有效负载，我得到整个firebase数据库快照对象而不仅仅是商店项目本身，因此ngrx商店接收到一个它无法理解的对象，并且应用程序状态不会改变。

请检查照片：当console.logged（）时，我看到了我需要的确切对象。但Redux Devtools揭示了真正的交易，我不知道如何解决这个问题。有人能给我建议吗？非常非常感谢你。

效果如下：

@Effect()
getShopItems: Observable<any> = this.actions.pipe(
    ofType(shopActions.GET_ITEMS),
    switchMap(() => {
        return of(this.database.ref('cart').once('value', snap => {
            snap.forEach(childSnap => childSnap.val());
            // snap.forEach(childSnap =>
            // console.log(childSnap.val()));
        }))
            .pipe(
                map((payload) => {
                    return {
                        type: 'GET_ITEMS_SUCCESS',
                        payload: payload
                    };
                }
            ));
    })
);

有问题的动作的reducer函数如下所示：

case shopActions.GET_ITEMS: {
            return {
                ...state,
                shopItems: [...state.shopItems],
                itemCount: state.shopItems.length
            };
}
case shopActions.GET_ITEMS_SUCCESS: {
            return {
                ...state,
                shopItems: [action.payload],
                itemCount: state.shopItems.length + 1
            };
}

https://imgur.com/a/pDGAwFI

Answer 1

使用而不是：

import { from } from 'rxjs';

@Effect()
getShopItems: Observable<any> = this.actions.pipe(
    ofType(shopActions.GET_ITEMS),
    switchMap(() => {
        return from(this.database.ref('cart').once('value', snap => {
            snap.forEach(childSnap => childSnap.val());
        }))
            .pipe(
                map((payload) => {
                    return {
                        type: 'GET_ITEMS_SUCCESS',
                        payload: payload
                    };
                }
            ));
    })
);

RxJs来自 - https://www.learnrxjs.io/operators/creation/from.html