使用 angularfire2 时要在 ngrx/store 中存储什么？

Question

我开始学习 angular2 并开始学习 ngrx/store（以前没有使用 redux 的经验）和 firebase 应用程序。现在，我不知道如何在商店中存储 firebase 对象、数组和其他东西。我是否应该按原样放置它们，例如，将这个 FirebaseListObservable 放在商店 af.database.list('/items') 中？它看起来很合适（组件可以只做 store.select('items') 并且模板可以订阅它，并且对于突变我仍然可以将事件触发到我将用缩减器改变列表的商店）但我的猜测不是因为这个列表可以从商店外改变（一些其他订阅相同列表的应用程序用户）。还是应该视具体情况而定？

如果不是，我应该在哪里存储对该 firebase 对象的引用以及我应该在商店中放入什么？

Answer 1

recommended只应将可序列化的内容放入商店：

It is highly recommended that you only put plain serializable objects, arrays, and primitives into your store. It's technically possible to insert non-serializable items into the store, but doing so can break the ability to persist and rehydrate the contents of a store, as well as interfere with time-travel debugging.

AngularFire2 observable 的异步特性意味着您可能希望使用 @ngrx/effects 来集成它们。 Effects 本质上是监听一个特定的动作，执行一些（可能是异步的）副作用，然后（通常）发出另一个动作。

你如何做取决于你想做什么。

例如，如果您希望使用 FirebaseListObservable 来执行查询，您可以使用典型的 READ_ITEMS、READ_ITEMS_SUCCESS 和 READ_ITEMS_ERROR 操作以及类似这样的效果:

@Effect()
readItems$ = this.actions$
  .ofType('READ_ITEMS')
  .switchMap(() => this.af.database
    .list('/items')
    .first()
    .map(items => ({ type: 'READ_ITEMS_SUCCESS', payload: items }))
    .catch(() => Observable.of({ type: 'READ_ITEMS_ERROR', payload: error.toString() }))
  );

但是，如果您想收听来自 FirebaseListObservable 的实时变化，您可以这样做：

@Effect()
refreshItems$ = this.af.auth
  .switchMap((authState) => authState ?
    this.af.database
      .list('/items')
      .map(items => ({ type: 'REFRESH_ITEMS', payload: items })) :
    Observable.of({ type: 'REFRESH_ITEMS', payload: [] })
  );

请注意，第二个效果不监听动作。相反，它会响应身份验证状态，并会在用户通过身份验证后发出 REFRESH_ITEMS 操作，等等

在这两种情况下，受影响的操作都将包含一个项目数组的有效负载 - 可以由 reducer 处理以存储在商店中。

使用 angularfire2 时要在 ngrx/store 中存储什么？

What to store in ngrx/store when using angularfire2?

firebase

redux

ngrx

angularfire2

angular