Question

我正在使用ngrx / store来跟踪活动图层的数组（将在地图上显示）。

{
  layers: ['layer_1', 'layer_2']
}

在我的组件中，我订阅了这个变量：

 this.mapState$
    .map(mapState => mapState.layers)
    .subscribe(layers=> console.log(layers));

现状

添加layer_3时获取['layer_1', 'layer_2', 'layer_3']
删除layer_2时，我得到['layer_1', 'layer_3']

我努力实现的目标而不是一个具有当前情况的数组。我想要两个阵列。一个包含所有添加项，一个包含所有删除项。

欢迎采用不同的方法。关键是我想将它存储在ngrx / store中。

这些只是我的第一步。在我的最终应用程序中，我想支持航点，可以添加，删除但也可以移动。当移动一个航点时，我需要在数组之前和之后读取航点以操纵（计算和重绘）一条路线。

更新：显然RxJS有一个Observable.ofArrayChanges，但在RxJS 5中已弃用。

Answer 1

你可以这样接近：

<强>减速机：

{
  layers: ['layer_1', 'layer_2'],
  changesInLayer: { type: 'ADD', layers: ['layer_1', 'layer_2']}
}

<强>动作：

ADD_LAYER：

{
   layers: [...this.state.layers, action.payload],
   changesInLayer: { type: 'ADD', layers: [action.payload]}
}

REMOVE_LAYER：

{
   layers: this.state.layers.filter(item => {
       return item !== action.payload
   }),
   changesInLayer: { type: 'REMOVE', layers: [action.payload]}
}

组件：

this.mapState$
    .subscribe(state => console.log(state.layers, state.changesInLayer));

RxJS订阅数组：查看更改

1 个答案: