Использование полезной нагрузки действия в подписке ActionsSubject на NGRX

Question

Я получил старый и плохой Property 'payload' does not exist on type 'Action выполняя эти действия подписки:

Поскольку это действие по созданию, мне нужна полезная нагрузка для проверки userId недавно созданного пользователя и перейдите к /users/userId

Кстати: я следую за этим действительно хорошим уроком

@Component({
  selector: 'app-sample',
  templateUrl: 'sample.html',
})
export class AppComponent {
  subs = new Subscription();

  constructor(private actionsSubject: ActionsSubject) {
    this.subs = actionsSubject.subscribe(action => {
      if (action.type === actions.CREATE_USER_SUCCESS) {
        console.log(action.payload);
      }
    });
  }
}

Answer 1

Если вы посмотрите на объявление класса ActionsSubject, вы заметите, что когда вы подписываетесь на него, вы должны получить объекты класса Actionопределяется так:

export interface Action {
  type: string;
}

Как видите, просто нет payload Вот. Это означает, что вам нужно сообщить TypeScript, что внутри, если вы ожидаете некоторый объект, который печатается более строго.

Я хотел бы попробовать (при условии, что ваш класс действий называется CreateUserSuccessAction):

this.subs = actionsSubject.subscribe((action: Action) => {
  if (action.type === actions.CREATE_USER_SUCCESS) {
    let createUserAction: CreateUserSuccessAction = action as CreateUserSuccessAction;  
    console.log(action.payload);
  }
});

или лучше (при условии, что вы используете RxJS 6):

this.subs = actionsSubject.pipe(
  filter((action: Action) => action.type === actions.CREATE_USER_SUCCESS)
).subscribe((action: CreateUserSuccessAction) => {
  console.log(action.payload);
});

Надеюсь, это поможет!