Question

我正在尝试实现ngrx，并且有一些api调用。对于每种方法，最佳实践显然是添加成功和失败的方法，以便我的效果可以调度准确的子动作。但是动作文件已经非常大了，就像只有6次通话...

import { HttpErrorResponse } from '@angular/common/http';
import { Action } from '@ngrx/store';
import { IOrganization } from './organization.models';

export enum ActionTypes {
  GetOrganizationsRequest = '[Organizations] Get Organizations Request',
  GetOrganizationsSuccess = '[Organizations] Get Organizations Success',
  GetOrganizationsFailed = '[Organizations] Get Organizations Failed',

  PostOrganizationsRequest = '[Organizations] Post Organizations Request',
  PostOrganizationsSuccess = '[Organizations] Post Organizations Success',
  PostOrganizationsFailed = '[Organizations] Post Organizations Failed',

  UpdateOrganizationRequest = '[Organizations] Update Organizations Request',
  UpdateOrganizationSuccess = '[Organizations] Update Organizations Success',
  UpdateOrganizationFailed = '[Organizations] Update Organizations Failed',


  RefreshOrganizationRequest = '[Organizations] Refresh Organizations Request',
  RefreshOrganizationSuccess = '[Organizations] Refresh Organizations Success',
  RefreshOrganizationFailed = '[Organizations] Refresh Organizations Failed',

  DeleteOrganizationRequest = '[Organizations] Delete Organizations Request',
  DeleteOrganizationSuccess = '[Organizations] Delete Organizations Success',
  DeleteOrganizationFailed = '[Organizations] Delete Organizations Failed',

  GetOrganizationsUsersRequest = '[Organizations] Get Users Organizations Request',
  GetOrganizationsUsersSuccess = '[Organizations] Get Users Organizations Success',
  GetOrganizationsUsersFailed = '[Organizations] Get Users Organizations Failed',

}

export class GetOrganizationsRequest implements Action {
  public readonly type = ActionTypes.GetOrganizationsRequest;
  constructor() {}
}

export class GetOrganizationsSuccess implements Action {
  public readonly type = ActionTypes.GetOrganizationsSuccess;
  constructor(public payload: {organization: Array<IOrganization>}) {}
}

export class GetOrganizationsFailed implements Action {
  public readonly type = ActionTypes.GetOrganizationsFailed;
  constructor(public payload: {error: HttpErrorResponse}) {}
}

export class PostOrganizationsRequest implements Action {
  public readonly type = ActionTypes.PostOrganizationsRequest;
  constructor(public payload: {organization: IOrganization}) {}
}

export class PostOrganizationsSuccess implements Action {
  public readonly type = ActionTypes.PostOrganizationsSuccess;
  constructor(public payload: {response: any}) {}
}

export class PostOrganizationsFailed implements Action {
  public readonly type = ActionTypes.PostOrganizationsFailed;
  constructor(public payload: {error: HttpErrorResponse}) {}
}


export class UpdateOrganizationRequest implements Action {
  public readonly type = ActionTypes.GetOrganizationsRequest;
  constructor(public payload: {organizationId: string, organization: IOrganization}) {}
}

export class UpdateOrganizationSuccess implements Action {
  public readonly type = ActionTypes.UpdateOrganizationSuccess;
  constructor(public payload: {response: any}) {}
}

export class UpdateOrganizationFailed implements Action {
  public readonly type = ActionTypes.UpdateOrganizationFailed;
  constructor(public payload: {error: HttpErrorResponse}) {}
}

export class RefreshOrganizationRequest implements Action {
  public readonly type = ActionTypes.RefreshOrganizationRequest;
  constructor(public payload: {organizationId: string}) {}
}

export class RefreshOrganizationSuccess implements Action {
  public readonly type = ActionTypes.RefreshOrganizationSuccess;
  constructor(public payload: {response: any}) {}
}

export class RefreshOrganizationFailed implements Action {
  public readonly type = ActionTypes.RefreshOrganizationFailed;
  constructor(public payload: {error: HttpErrorResponse}) {}
}

export class DeleteOrganizationRequest implements Action {
  public readonly type = ActionTypes.DeleteOrganizationRequest;
  constructor(public payload: {organizationId: string}) {}
}

export class DeleteOrganizationSuccess implements Action {
  public readonly type = ActionTypes.DeleteOrganizationSuccess;
  constructor(public payload: {response: any}) {}
}

export class DeleteOrganizationFailed implements Action {
  public readonly type = ActionTypes.DeleteOrganizationFailed;
  constructor(public payload: {error: HttpErrorResponse}) {}
}


export class GetOrganizationsUsersRequest implements Action {
  public readonly type = ActionTypes.GetOrganizationsUsersRequest;
  constructor(public payload: {organizationId: string}) {}
}

export class GetOrganizationsUsersSuccess implements Action {
  public readonly type = ActionTypes.GetOrganizationsUsersSuccess;
  constructor(public payload: {response: any}) {}
}

export class GetOrganizationsUsersFailed implements Action {
  public readonly type = ActionTypes.GetOrganizationsUsersFailed;
  constructor(public payload: {error: HttpErrorResponse}) {}
}

export type Actions =   GetOrganizationsRequest |
                        GetOrganizationsSuccess |
                        GetOrganizationsFailed |
                        PostOrganizationsRequest |
                        PostOrganizationsSuccess |
                        PostOrganizationsFailed |
                        UpdateOrganizationRequest |
                        UpdateOrganizationSuccess |
                        UpdateOrganizationFailed |
                        RefreshOrganizationRequest |
                        RefreshOrganizationSuccess  |
                        RefreshOrganizationFailed |
                        DeleteOrganizationRequest |
                        DeleteOrganizationSuccess  |
                        DeleteOrganizationFailed  |
                        GetOrganizationsUsersRequest |
                        GetOrganizationsUsersSuccess |
                        GetOrganizationsUsersFailed;

一个大型的角度应用程序包含多少个动作，这不是一团糟吗？

Answer 1

是的，这是“正常”的。主要是因为操作描述了应用程序中的唯一事件。从NgRx开始，其中的某些代码将使用createAction和createReducer变得更小（但主要原理仍然存在）。

此外，还有@ngrx/entity和@ngrx/data（或ngrx-data v8之前的版本）可以消除部分代码。

在ngrx中执行大量操作是否正常？

1 个答案: