Как обновить использование синтаксиса @ ngrx / store с версии 2.2.1 до версии 6.1.2

Question

Как обновить использование синтаксиса @ ngrx / store с версии 2.2.1 до версии 6.1.2

Недавно я обновил свой проект Angular с Angular ^ 2.0.0 до Angular ^ 6.0.0 и связанных с ним npm.плагины.Однако я не знаком с использованием @ngrx/store и immutable.После обновления проекта приложение в основном работает.Но следующий код выдает ошибку: can not read get of undefined:

import { Store } from '@ngrx/store';

// .....

    this.modifyState$ = store.select('suitablyInfoModify');
    this.client$ = this.modifyState$.map(data => data.get('client'));

// works on @ngrx/store v2.2.1, immutable v3.8.1
// errors on @ngrx/store v6.1.2, immutable v3.8.2

Показывает, что @ngrx/store не передает data в map функцию.Переменная data сейчас undefined.

Так как же мне изменить эту часть, чтобы она работала?И надеюсь совместим с оригинальным кодом.

Answer 1

Решено!

На самом деле проблема была вызвана StoreModule config:

@NgModules({
  imports: [
    // ...
    // previous i wrote like this
    StoreModule.forRoot(reducer)
  ]
})

, так что в подпитке магазина данные всегда будут undefined.

После однодневного изучения я наконец-то обнаружил эту ошибку и уже исправил ее:

@NgModules({
  imports: [
    // ...
    // fix it
    StoreModule.forRoot({
      suitablyInfoModify: reducer,
    })
  ]
})

Ха, наконец-то ~

Благодаря ответу @ Johnчто также помогает мне!

Answer 2

Если вы перейдете к ngrx monorepo на github , вы можете просмотреть всю документацию для прошлых выпусков, нажав кнопку «Branch: master» (расположенную слева от зеленого «Clone» или загрузив ее).«кнопка»> выбрав вкладку «теги»> щелкнув тег, связанный с интересующей вас версией приложения. Это покажет вам репо, как это было для этой версии, затем вам нужно будет перейти к документации для магазина.(который, я думаю, мог перемещаться в репо между версиями).

К сожалению, репо изменилось между версией 2 и версией 4 (не было версии 3), поэтому у них там нет документации по версии 2(Я не уверен, где это).Тем не менее, если вы сравните документацию для версии 4 с документацией для версии 6 ngrx / store, надеюсь, это поможет вам понять, что изменилось.

Одно изменение: rxjs перемещен в lettableоператоры .Я не уверен, что они по-прежнему допускают синтаксис observable.operator() в 6-й версии angular, но в более поздних версиях вам определенно необходимо использовать синтаксис оператора lettable observable.pipe(operator()).

В ngrx/store новомсинтаксис store.pipe(select()), и вам нужно будет импортировать каждую операторную функцию отдельно.

this.modifyState$ = store.pipe(select('suitablyInfoModify'));
this.client$ = this.modifyState$.pipe(map(data => data.get('client')));

Кроме того, если только данные, возвращаемые вашим редуктором 'suitablyInfoModify', не являются классом или объектом, он не будет иметьget() метод, связанный с ним.Обычно (во всех примерах, которые я видел) редукторы ngrx возвращают простые (например, json) данные.Это не является обязательным требованием, поэтому ваш редуктор определенно может возвращать экземпляры классов.

Отдельно, я не помню, использует ли Angular 6 rxjs 6 или нет, но rxjs 6 также ввел ряддругие изменения.Если вы можете, обновление до rxjs 6 сейчас (хотя вы уже проходите процесс обновления в любом случае) облегчит вашу жизнь в будущем.