1

我似乎被困在这里,因为没有很多关于如何使用firestore和ngrx的指南或教程。假设我们有组织清单,所有这些将被用于2个组分,组分和组分B中。用ngrx找出firestore

  1. 我可以做一个效果,它需要一个LOAD_ACTION来合并集合valuechanges observable,并且还将它映射到每个组件的LOAD_ACTION_SUCCESS。

现在每当有变化,LOAD_ACTION_SUCCESS都会被调用,将我们的数据保存到它们的每个存储状态。

但是这需要组件调度LOAD_ACTION以开始,这对于REAL_TIME_DATA可能看起来有点错误,因为它将在之后继续更新。即使不使用。

  1. 我可以在组件本身中连接valuechanges的服务可观察值(与LOAD_ACTION相同)。它不会保存状态,但Firebase可观察点就像一个Store(只要它不保存在客户端),所以如果它已经获得了数据,它就已经存在了。

不再使用状态数据的2个副本。

这使我:

  • 如果它也许有来自服务,这两个组件从,获取数据“收集”商店如没有多在任何地方使用该状态的副本。
  • 任何信息或指导,以帮助我得到进一步赞赏,我似乎被困在这样一个小问题,显然我可以保持编码,而是希望它是正确的。

    由于涉及到ngrx,处理实时数据似乎让我感到困惑。

    示例也将被赞赏。

    回答

    1

    我刚刚写了一个关于这个问题的小小blog,我想比较一下连接Firestore和NGRX的不同方法。

    基本上,您可以将valueChanges()操作映射到您的商店操作,并且商店将同步。我使用了一种效果,但也可以在服务中使用。

    @Effect() 
        getData$ = this.dataDb.getFakeDataStateChanges().pipe(
        mergeMap(actions => actions), 
        map(action => { 
         return { 
         type: `[FirstData] ${action.type}`, 
         payload: { id: action.payload.doc.id, ...action.payload.doc.data() } 
         }; 
        }) 
    ); 
    

    当动作都像

    export enum FirstActionTypes { 
        FIRST_DATA_ADDED = '[FirstData] added', 
        FIRST_DATA_MODIFIED = '[FirstData] modified', 
        FIRST_DATA_REMOVED = '[FirstData] removed' 
    } 
    

    和减速器处理数据

    export function firstReducer(state: State = initialState, action: FirstAction) { 
        switch (action.type) { 
        case FirstActionTypes.FIRST_DATA_ADDED: 
         return firstAdapter.addOne(action.payload, state); 
    
        case FirstActionTypes.FIRST_DATA_MODIFIED: 
         return firstAdapter.updateOne(
         { 
         id: action.payload.id, 
         changes: action.payload 
         }, 
         state 
        ); 
    
        case FirstActionTypes.FIRST_DATA_REMOVED: 
         return firstAdapter.removeOne(action.payload.id, state); 
    
        default: { 
         return state; 
        } 
        } 
    }