当 ngrx 存储状态包含 Map 时，为什么无法识别对此 Map 的更改？

我根据他们的示例应用程序迁移到 Ngrx Store v4.1.1 (+ Angular5)。一切都像以前一样运行良好，但有一个 SubStore。该 SubStore 的状态包含一个已更改的 Map。但对这张地图的更改不知何故无法被识别。

工作中的 Plunker 可以在这里找到：https://plnkr.co/edit/2Z77Cq?p=preview https://plnkr.co/edit/2Z77Cq?p=preview详细代码如下

我的 NgModule 看起来像这样：

import {reducers} from './reducers';

@NgModule({
   imports: [ 
     BrowserModule,
     StoreModule.forRoot(reducers) 
   ],
   declarations: [ App ],
   bootstrap: [ App ],
   providers: [Service]
})

我的减速机看起来像这样：

import {
  ActionReducerMap,
  createSelector,
  createFeatureSelector,
} from '@ngrx/store';

import * as character from './character.reducer';

export interface State {
  character: character.State;
}

export const reducers: ActionReducerMap<State> = {
  character: character.reducer,
};

/** Character **/
export const getCharacterState = createFeatureSelector<character.State>('character');

export const getCharacter = createSelector(
  getCharacterState,
  character.getCharacter
);

SubStoreReducer包含以下代码：

import { Character, Item } from './models';
import * as character from './character';

export interface State {
  character: Character;
}

export const initialState: State = {
  character: null,
};

export function reducer(state = initialState, action:character.Actions): State {
  switch (action.type) {
    case character.INIT_CHARACTER:
      const char: Character = action.payload;
      state.character = char;
      console.log('init char', char);
      return Object.assign({}, state);

    case character.EQUIP_ITEM:
      const eqItem: Item = action.payload;
      state.character.wardrobeItemIds.set(eqItem.part, eqItem.id);
      console.log('eq ITEMMM', eqItem, state.character.wardrobeItemIds);
      return Object.assign({}, state);

    default:
      return state;
  }
}

export const getCharacter = (state: State) => state.character;

相应的操作是：

import { Action } from '@ngrx/store';
import { Character, Item } from './models';

export const INIT_CHARACTER = '[Character] Initialized Character';
export const EQUIP_ITEM = '[Character] Equipped Item';

export class InitCharacter implements Action {
  readonly type = INIT_CHARACTER;
  constructor(public payload: Character) {}
}

export class EqItem implements Action {
  readonly type = EQUIP_ITEM;
  constructor(public payload: Item) {}
}

export type Actions =
  InitCharacter |
  EqItem;

现在我在服务中使用新角色初始化 SubStore：

import { Injectable } from '@angular/core';
import { Store } from '@ngrx/store';
import { Observable } from 'rxjs/Observable';
import {Character, Item} from './models';

import * as fromRoot from './reducers.ts';
import * as CharacterAction from './character.ts';

@Injectable()
export class Service {
  character$: Observable<Character>;

  constructor(
    private store: Store<fromRoot.State>
  ) {
    // listen to the store
    this.character$ = this.store.select(fromRoot.getCharacter);

    this.character$.subscribe(
      (state: any) => console.log('char store triggered. State:', state)
    );

    // init the wardrobeItemIds Map
    const wardrobeItemIds = new Map<string, string>();
    wardrobeItemIds.set('part1', 'anyId');

    // init the character (this is just a dummy)
    let newCharacter: Character = {
      baseType: 'anyString',
      skinItemIds: [
        'string1',
        'string2'
      ],
      wardrobeItemIds: wardrobeItemIds
    }
    this.store.dispatch(new CharacterAction.InitCharacter(newCharacter));
  }

  addItem(part: string): void {
    // add rnd item of given part
    const item: EquipItem = {
      id: Math.random().toString(),
      part: part,
    }
    this.store.dispatch(new CharacterAction.EqItem(item));
  }
} 

这会导致我的订阅位于同一服务内

this.character$.subscribe(
  (state: any) => console.log('char store triggered. State:', state)
);

记录字符，这很好，因为它从 null 更改为字符对象。

现在如果我打电话addItem()哪个调用this.store.dispatch(new CharacterAction.EqItem(item));应该将一个项目添加到地图中state.character.wardrobeItemIds.

这应该会导致 Store Observable 再次触发，并且订阅应该记录更改的字符。但不知何故什么也没发生。 已经检查减速器是否正确接收操作。

不确定这只是我的愚蠢还是某种错误？

提前谢谢 飞鸟

看来 @ngrx/entity 是商店中更复杂数据结构的预期解决方案。如果您打开 Map，它们的使用将触发新的运行时检查，因为它们既不是不可变的也不是可序列化的。