如果使用 ngrx/store 和效果，服务有什么用？

Question

我正在尝试将 NGRX 添加到我的 Angular 项目中，但我不知道我是否仍然需要服务，因为组件可以调度操作。 这是否意味着我不必使用除 ngrx/store 之外的任何服务？

Answer 1

我仍然使用服务来封装逻辑。 通常，组件与服务对话，服务与商店对话。

我发现服务所做的范围不仅仅是存储，因此删除它们会将太多的职责/业务逻辑放入存储组件中。

我的商店专注于简单的类似 api 的操作，这些操作简短且易于测试，例如

  static INITIALIZE_CONFIG_REQUEST = 'INITIALIZE_CONFIG_REQUEST';
  static INITIALIZE_CONFIG_SUCCESS = 'INITIALIZE_CONFIG_SUCCESS';
  static INITIALIZE_CONFIG_FAILED  = 'INITIALIZE_CONFIG_FAILED';
  static INITIALIZE_CONFIG_TEMPLATE_ERROR  = 'INITIALIZE_CONFIG_TEMPLATE_ERROR';

  createInitializeConfigRequest() { // separate from invoking call for easier testing
    return {
      type: ConfigActions.INITIALIZE_CONFIG_REQUEST,
      httpRequest: {
        url: 'api/path/to/config',
        successAction: this.createInitializeConfigSuccess,
        failedAction: this.createInitializeConfigFailed,
        validateResponse: (data) => this.checkTemplate(data)
      }
    };
  }
  initializeConfigRequest() {  // called by config.service
    this.store.dispatch( this.createInitializeConfigRequest() );
  }

  createInitializeConfigSuccess(data) {
    const payload = data;
    return {
      type: ConfigActions.INITIALIZE_CONFIG_SUCCESS,
      payload
    };
  }

  createInitializeConfigFailed(error) {
    return {
      type: ConfigActions.INITIALIZE_CONFIG_FAILED,
      payload: {
        error
      }
    };
  }

使用这种模式，我可以更轻松地添加中间件，例如上面处理 httpRequest 和 Response 验证的中间件。

大多数缩减是通过单个通用缩减器完成的，它假设有效负载属性与存储属性完全对应。 这是我最喜欢的约定，因为现在我有一组针对通用减速器的综合测试，而不是对 n 个减速器的 n 次重复测试。

  genericActionHandler(state, action) {
    if (!action.payload) {
      return state;
    }
    const newState = {...state};
    Object.assign(newState, action.payload);
    return newState;
  }

希望能让你对我的架构有所了解。

Answer 2

效果专门用于与应用程序外部的API 和其他实体进行交互，并在 NGRX 规范中如此定义。 他们不知道也不应该知道诸如本地路由器状态、生命周期钩子和类似的事情：他们甚至不知道组件的存在，除非通过操作有效负载明确通知此组件的某些方面。

另一方面，注入到组件中的服务确实了解这些东西，或者可以通过这些知识轻松提供。

因此，当您想要执行任何自包含且仅限于内部应用程序的操作时，您可以使用服务。 当您希望某个操作触发某种外部交互时，例如 API 调用，或者打开 Web 套接字或 ssh 连接，您可以使用效果。

注意：如果您希望在您的组件中创建和销毁您的服务，您需要将其定义为组件元数据内的提供者，在组件本身内，因为在模块级别提供的服务将是单例。

补充阅读：

https://medium.com/@m3po22/stop-using-ngrx-effects-for-that-a6ccfe186399

https://ngrx.io/guide/effects