Angular 6 @ngrx/store api 调用

标签 angular angular6 ngrx ngrx-store

我正在尝试在我的应用程序中添加带有 api 调用的 @ngrx/store。

但我实际上没有找到哪里是进行 api 调用的最佳位置以及哪里是进行调度调用的最佳位置。

例如,我有一个Reducer“AllBooks”

我的组件书籍

从我的图书服务获取数据

图书服务进行 api 调用并获取数据。

API 调用

在一些教程中我看到api调用是在reducer中 在其他情况下,API 调用在服务中进行。

调度调用

在一些教程中,我看到调度调用是从组件进行的。 在其他情况下,API 调度位于服务中。

我正在寻找 Angular 6 的新简单演示代码,该代码使用 @ngrx/store 和 api 调用来了解码织代码的最佳实践

这是我当前的组件代码(构造函数):

this._passwordService.getPasswordsById(id).subscribe(
  (data) => {
    this.password = data;
    this._store.dispatch(new PasswordActions.GetPassword(this.password));

    this.onInit();
  },
  (error: any) => { console.log(error) })

最佳答案

您应该在您的效果中调用该服务。效果来自@ngrx/effects 包,它是处理副作用的地方。请参阅docs了解更多信息。

您可以在 NgRx example app 中找到示例.

关于Angular 6 @ngrx/store api 调用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53117056/

相关文章:

angular - 如何只生成 API 的接口(interface)?

angular - angular2 rc.6 如何禁用显示 pdf 的嵌入 html 标签上的清理

javascript - 单击并拖动每条绘图线可创建多条垂直绘图线。使用 Angular 6 和 Highcharts 开发

javascript - 如何使用 ngrx 状态管理编辑表单数据?我得到错误(尝试比较错误 '[object Object]' 。仅允许数组和迭代”))

javascript - Angular ngrx例子理解reselect

javascript - Angular2 + ngrx/存储 : how to change state within a loop?

angular - 如何以 Angular 使用来自另一个语言环境的 Assets ?

javascript - Angular RxJs - 在第二个流中填充数组(嵌套流)

angular6 - 将 Angular 6 升级到 8 时,我得到了不兼容的对等依赖(使用 ng update @angular/core)

angular6 - 如何在 Angular cli 6.0.1 中创建 Angular 5 项目