开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

Ngrx/effects在角度为2的异步模式下不起作用

Ngrx/effects是一个Angular框架中用于处理异步操作的库。它提供了一种简洁而强大的方式来管理应用程序中的副作用，例如异步数据获取、网络请求和状态更新。

在Angular中，Ngrx/effects通常与Ngrx/store一起使用，以实现应用程序的状态管理。Ngrx/store用于管理应用程序的状态，并提供了一种可预测和可维护的方式来管理数据流。而Ngrx/effects则用于处理与外部资源的交互，例如HTTP请求、WebSocket通信等。

在Angular 2中，异步模式下使用Ngrx/effects时可能会遇到一些问题。这可能是由于配置错误、版本不匹配或其他原因导致的。为了解决这个问题，可以尝试以下几个步骤：

确保已正确安装和配置Ngrx/effects库。可以通过运行以下命令来安装最新版本的Ngrx/effects：
确保已正确安装和配置Ngrx/effects库。可以通过运行以下命令来安装最新版本的Ngrx/effects：
确保在应用程序的模块中正确导入和配置Ngrx/effects。在应用程序的模块文件中，需要导入EffectsModule并将其添加到imports数组中。例如：
确保在应用程序的模块中正确导入和配置Ngrx/effects。在应用程序的模块文件中，需要导入EffectsModule并将其添加到imports数组中。例如：
其中，MyEffects是自定义的Effects类，用于处理异步操作。
检查Effects类的实现是否正确。在Effects类中，需要使用@Effect装饰器来定义处理异步操作的方法。确保方法的实现正确，并且使用正确的操作符来处理异步操作。例如，可以使用switchMap、mergeMap或concatMap操作符来处理HTTP请求。
检查是否正确使用了Action和Reducer。在应用程序中，需要正确定义和分发Action，并在Reducer中处理这些Action。确保在Effects类中正确分发Action，并在Reducer中处理这些Action以更新应用程序的状态。

如果以上步骤都正确执行，但Ngrx/effects在Angular 2的异步模式下仍然不起作用，可能需要进一步检查应用程序的配置和代码实现。可以尝试查看官方文档、社区论坛或其他资源，以获取更多关于Ngrx/effects在Angular 2中使用的指导和解决方案。

关于Ngrx/effects的更多信息和示例，可以参考腾讯云提供的相关文档和产品介绍：

Ngrx/effects官方文档：https://ngrx.io/guide/effects
腾讯云相关产品：暂无推荐的腾讯云产品和产品介绍链接地址

相关搜索:.push()在抛出的情况下不起作用，它使用异步等待方法在javascript中循环获取数据 Shell通配符在Julia的shell模式下不起作用使用初始值为零的Gekko - variable C2 (NH2Cl)的模拟模式不起作用-为什么？函数上的Jquery在引导模式下不起作用在ag-grid中调整大小和重新排序在角度2中的IPAD上不起作用。在角度为2的TypeScript中组件引用的普通对象上未定义函数在调用操作之前，将ngrx/effects中的RXJS操作链接到为不同操作调用Firebase的策略在选择标记中显示在角度2中不起作用的对象如何在iterm2的vim中使光标在插入模式下显示为垂直线，在正常模式下显示为块带有ModalRoute.withName()的颤动Navigator.popUntil()在剖面和释放模式下不起作用

相关搜索:

页面内容是否对你有帮助？

有帮助

没帮助

相关·内容

Angular 接入 NGRX 状态管理

中存储的状态做出相应的改变； Selector：用于获取存储状态切片的纯函数； Effects：基于流实现的副作用的处理，以减少基于外部交互的状态。...NGRX 状态管理中包含了两条变更状态的主线：同步变更状态：用户 => Action => Reducer => Store（State）；异步变更状态：用户 => Action => Effects...）来完成异步获取网络数据更新状态。...安装 effects 核心模块： npm install @ngrx/effects --save 创建 User 的副作用：选项介绍：选项作用 --root 目标模块为根模块时设置 --module...：接入实体的代码在 todo.reducer.ts 文件中体现，下面是接入实体的核心部分，更多的适配器操作可以看文件中默认生成的模板代码： // 1.

1811 0

angular4实战（4）ngrx

本次演示的示例为通过ngrx的状态管理来控制HTTP请求服务的全局loading动画显示。...如下： ngrx地址：https://github.com/ngrx ngrx主要有四个模块，分别是 ngrx/store， ngrx/effects， ngrx/router-store...但自己本地没有把这段代码跑成功，未报错，但不起作用，就用做简单的方法来实现reducer的汇总。...关联store ngrx的关联通过在app.module.ts将StoreModule注入reducer。...比如{name:j_bleach}=>{name:bleach} 或者输入属性为一个数组的时候[1,2,3]=>[1,2,3].push(4) 以上这两种方式都不会引发angular的检查策略

1.1K3 0

一个Angular 5教程：一步一步指导实现你的第一个Angular 5应用程序

实际上，Angular为我们提供了一些糖语，我们可以在这里使用它，所以我从另一个角度开始解释糖的工作原理。...“Redux是一种管理应用程序状态的模式。”...为此，我们安装effects模块： yarn add @ngrx/effects [...] success Saved 1 new dependency. └─ @ngrx/effects@4.1.1...有些东西不起作用。从我们的日志中可以看出，我们正在明确调度Action，但没有服务器请求在这里为我们提供。怎么了？我们忘了将我们的效果加载到我们的AppModule中。...NgRX是一种管理应用程序状态的模式。这是一个支持Angular应用程序的RxJS驱动的状态管理库。它使我们能够拥有单一的应用程序状态，将所有组件连接在一起，并为我们的应用程序提供可预测和一致的行为。

42.5K1 0

调试 RxJS 第2部分: 日志篇

原文链接: https://blog.angularindepth.com/debugging-rxjs-part-2-logging-56904459f144 本文为 RxJS 中文社区翻译文章，...在本文中，我将展示如何以一种不唐突的方式来使用 rxjs-spy 获取详情和有针对性的信息。来看一个简单示例，示例中使用的是 rxjs 和 rxjs-spy 的 UMD bundles: ?...rxjs-spy 对使用 tag 操作符标记过的 observables 起作用，tag 操作符使用字符串标签名来注释 observable，仅此而已。...在组成 observable 之前，示例启用了侦察，并为匹配 /user-.+/ 正则表达式或标签名为 users 的 observable 配置日志记录器。示例的输入看上去应该是这样的: ?...当编写 redux-observable 的 epics 或 ngrx 的 effects 时，我见过一些开发者的代码大概是这样的: ? 乍看上去没什么问题，而且大多数情况下也能正常运行。

1.2K4 0

React Effects List大重构，是为了他？

Passive指useEffect回调执行 ChildDeletion指移除子DOM节点等等更新造成DOM变化主要就是Placement、ChildDeletion在起作用。...Effects List 在重构前，render阶段，带有副作用的节点会连接形成链表，这条链表被称为Effects List。...在commit阶段，再根据SubtreeFlags一层层查找有副作用的节点并执行对应操作。可见，SubtreeFlags需要遍历树，而Effects List只需要遍历链表，效率更高。...毕竟根据Suspense的理念，如果子孙组件有异步加载的内容，那应该只渲染fallback（而不是同时渲染display: none的内容）所以在新版中，针对Suspense内「不显示的子树」做了单独的处理...，既不会渲染display: none的内容，也不会执行useEffect回调：要实现这部分处理的基础，就是改变commit阶段遍历的方式，也就回到开篇提到的Effects List重构为subtreeFlags

6232 0

React Effects List大重构，是为了他？

Passive指useEffect回调执行 ChildDeletion指移除子DOM节点等等更新造成DOM变化主要就是Placement、ChildDeletion在起作用。...Effects List 在重构前，render阶段，带有副作用的节点会连接形成链表，这条链表被称为Effects List。...在commit阶段，再根据SubtreeFlags一层层查找有副作用的节点并执行对应操作。可见，SubtreeFlags需要遍历树，而Effects List只需要遍历链表，效率更高。...毕竟根据Suspense的理念，如果子孙组件有异步加载的内容，那应该只渲染fallback（而不是同时渲染display: none的内容）所以在新版中，针对Suspense内不显示的子树做了单独的处理...，既不会渲染display: none的内容，也不会执行useEffect回调：要实现这部分处理的基础，就是改变commit阶段遍历的方式，也就回到开篇提到的Effects List重构为subtreeFlags

4032 0

56. 精读《重新思考 Redux》

，从这个角度看，redux 是会降低工作效率的。...作者从 6 个角度阐述了基于 redux 的框架需要解决什么问题。...的值，再加上 store 的 name 为前缀保证唯一性即可。...; 其次使用 async 在 effects 函数中，使用 this.increment 函数调用方式，取代 put({type: "increment"})（dva），在 typescript 中拥有了类型支持...{ state += 1; return state; } } }; 但是当 state 为非对象时，immer 将不起作用，所以最好能养成 return state

4412 0

写在 2021: 值得关注学习的前端框架和工具库

Web React 状态管理 Jotai[2]，原子化的状态管理思路（就像React官方的Recoil），亮点是API比Recoil简洁很多，对Suspense模式支持好，可以考虑用来代替useContext...IceStore[3]，淘系Ice团队出品的状态管理库，我在日常业务中使用最多的一个状态管理方案，亮点是基于Immer来实现数据不可变，整体的使用方案类似Dva，state + reducer + effects...PM2[33]，NodeJS进程管理工具，零宕机重启、支持fork和cluster模式、blabla...，更?的地方在于提供了很geek的可视化界面，如我的服务器上截图： ?...通用 RxJS[86]，ReactiveX实际上是一个“理念”，在各个语言都有相关的实现，如RxDart[87]RxJava[88] RxPy[89] RxGo[90] 等等，在对于异步的处理上是非常有帮助的一个库...秉承了Angular的思想，提供了一整套的集成：和Angular Router的集成：@ngrx/router-store；对于集合类型的适配：@ngrx/entity；副作用管理：@ngrx/effects

4.2K1 0

写在2021: 值得关注学习的前端框架和工具库

IceStore，淘系Ice团队出品的状态管理库，我在日常业务中使用最多的一个状态管理方案，亮点是基于Immer来实现数据不可变，整体的使用方案类似Dva，state + reducer + effects...PM2，NodeJS进程管理工具，零宕机重启、支持fork和cluster模式、blabla…，更的地方在于提供了很geek的可视化界面，如我的服务器上截图： Prisma，下一代ORM，不仅仅是ORM...通用 RxJS，ReactiveX实际上是一个“理念”，在各个语言都有相关的实现，如RxDart RxJava RxPy RxGo 等等，在对于异步的处理上是非常有帮助的一个库，但有一定的学习成本，比如海量的操作符与操作符组合...秉承了Angular的思想，提供了一整套的集成：和Angular Router的集成：@ngrx/router-store；对于集合类型的适配：@ngrx/entity；副作用管理：@ngrx/effects...E2E测试：Cypress / PlayWright，说实话很少能看到业务项目有完备的单元测试和集成测试，更不要说E2E测试了，因为的确要花不少时间。

2.8K1 0

redux-saga

/iterator实现是因为它非常适合流程控制的场景，体现在： yield让描述串行/并行的异步操作变得很优雅以同步形式获取异步操作结果，更符合顺序执行的直觉以同步形式捕获异步错误，优雅地捕获异步错误..."] D1-1 at 4019 D2 at 4020 D1-2 at 5022 ["D1-2", "D2"] 执行顺序为：A -> B -> C1,C2 -> D1-1 -> D2 -> D1-2 redux-saga...所以添一层描述对象来解决这个问题，测试case中可以简单比较描述对象，实际起作用的Promise由redux-saga内部生成这样做的好处是单测中不用mock异步方法（一般单测中会把所有异步方法替换掉...从单元测试的角度来看，Effect相当于把参数提出去了，让“比较传入参数是否相同”这一步可以在外面统一进行，而不用逐个mock替换 P.S.关于易测试性的更多信息，请查看Testing Sagas 另外...这样保证了LOGOUT总是在执行过LOGIN之后的某个时刻发生的，代码看起来相当漂亮特定操作提示 // 在创建第3条todo的时候，给出提示消息 function* watchFirstThreeTodosCreation

1.9K4 1

有效的只读属性

描述这些特性超出了本提案的范围，但是要充分把握本篇提案的动机，就需要对这些特性的重要性有基本的了解。动机异步函数被设计用来计算，这个计算过程在返回之前有可能或者一直挂起去执行。...[] // error: cannot 'await' in a sync context } } 在lastTransaction中throw的使用强调这种设计模式对于属性和下标是不可用的...此外，可以通过在get后增加效果关键字为例如协议来声明效果属性....本篇提案初衷是允许在计算属性和下标中使用 Swift 并发特性。为有效的只读属性提议的设计实现起来轻量而且简单，同时为现有的程序提供明显的好处。...async/await特性是专门为异步编程定制的，因此不用考虑异步属性不依赖该特性的备选方案。同样，throws/try也是一样。

1.8K6 0

使用BeanFactoryPostProcessor——这种姿势不要用

使用BeanFactoryPostProcessor这种姿势不要用前言在公司内，Spring基本都是首选的IOC框架，Spring也提供了很多扩展点让我们介入到容器的生命周期中，例如BeanFactoryPostProcessor...最终为null。...让我们研究下@Resource @AutoWired这种注解是如何注入依赖的，如何起作用的就明白了。...applicationContext) throws BeansException { this.context = applicationContext; } } 这样问题就更大了，虽然在大多数的场景下不会有问题...("aBean")的方式，那也请做好listener or processor 的生命周期管理，保证在容器彻底起来之后才开始处理请求总结本文列举了BeanFactoryPostProcessor错误使用可能造成的问题

2K3 0

SAP 电商云 Spartacus UI Store 相关的设计明细

languages: LanguagesState; currencies: CurrenciesState; baseSite: BaseSiteState; } 以 CurrenciesState 为例...注意 SITE_CONTEXT_FEATURE 的使用场合，除了本文件定义 feature state 之外，还用在下列两个文件内：场景1：用来创建 feature selector：场景2：使用...StoreModule.forFeature 注册 store：当使用 createSelector 和 createFeatureSelector 函数时，@ngrx/store 会跟踪调用选择器函数的最新参数...写法1 下图 2 必须是 1 的一个切片，并且 3 的类型必须和 2 的类型一致： 2 的位置其实就是 result 的位置：写法2 import { createSelector, createFeatureSelector...selectFeatureCount = createSelector( selectFeature, (state: FeatureState) => state.counter ); 我做过测试，在

1131 0

NIPS 2022 推荐系统，因果效应论文集锦

Recommender Retriever【批内重要性重采样】 Infinite Recommendation Networks: A Data-Centric Approach【无限推荐网络：一种以数据为中心的方法...Tuning-free Approach to Switch between Synchronous and Asynchronous Training for Recommendation Models【GBA：在推荐模型的同步和异步训练之间切换的免调优方法...from Sets of Interventions in the Presence of Unobserved Confounders【在未观察到的混淆者存在的情况下，从干预措施中分离解耦因果效应】...模型行为的因果关系】 An Adaptive Kernel Approach to Federated Learning of Heterogeneous Causal Effects【异质因果联邦学习的自适应核方法...of Interpretability【从可解释性的角度对非均质干预效果模型进行基准测试】

5424 0

实现一个vuex-loading插件

Contents 1 前言 2 如何实现 3 使用 4 关于前言在项目中，如何管理loading是一个很头疼的方式，有的是在请求封装里去做了一个全屏loading，有的是在单页面中管理一个loading...: { ...state.effects, [actionType]: true }, }; break; // 如果是显示的话将本模块的都置为...= { ...state.effects, [payload]: true // 将当前的action 置为true };......state.effects, [payload]: false // 将当前的action 置为false }; } }...["user/addAction"] }) }, 两者相同的都是在effects[]这个数组中取key为我们要执行的那个异步操作的type这样就能获取到他的loading状态因为在两者的全局

7641 0

React18 带来了什么

以 Concurrency（并发性）为核心的底层渲染模型增强新的 Suspense 带来的异步数据处理机制作为以上能力的外显，补充了一些新的 API 和hooks.同时，将一些旧的 API 标记为 Deprecated...Suspense 下的全新异步数据获取机制作为本次新版本的另外一个重量级特性，Suspense 在未来的开发中很值得我们期待。...为了检测是否是符合要求的组件写法，在18版本的严格模式的开发环境下，会模拟一个组件卸载再用保存的状态re-render的过程：在以前，React 加载组件的逻辑为：- `React mounts the...`在 React 18 严格模式的开发环境，React 会模拟卸载并重载组件：`* React mounts the component.` `* Layout effects are created...如果promise执行得很快，它的结果由garbage-collected处理2.

7176 0

TDesign 更新周报（2022年5月第3周）

中的适配问题，可参考案例 tdesign-vue-next-nuxt-starter Tabs：添加拖拽功能 Anchor：增加 demo 演示功能 Bug Fixes Table：修复在 ssr...环境中的兼容 Transfer：修复对 pagination 组件的引用报错 Swiper：slot 执行位置不对，导致vue警告 Steps：修复 readonly 不起作用的问题 Slider...Table：拖拽排序，修复参数为 undefined 问题 Table：使用 header-affixed-top 时，异步下不能动态更新列 Menu：修复 expanded 不受控的问题 Cascader...Transfer：异步赋值 checked 不生效 Menu：修复 width 不生效的问题 Menu：修复暗色模式的 Popup Menu：修复 Popup 无法正常展示的问题 Menu...的 showErrorMessage 属性失效的问题 Form：修复触发方式 blur 不生效的问题 Form：修复传入的字段值为 undefined 的时候不会更新双向绑定值 Switch：修复

2.8K3 0

flask之异步非堵塞实现

同步：是指完成事务的逻辑，先执行第一个事务，如果阻塞了，会一直等待，直到这个事务完成，再执行第二个事务，顺序执行异步：是和同步相对的，异步是指在处理调用这个事务的之后，不会等待这个事务的处理结果，直接处理第二个事务去了...，我们又不希望程序被阻塞在函数A的睡的状态，所以我们采用异步执行，即在函数A睡的状态，让其他的任务执行 from threading import Thread from time import sleep...参数，必须将debug设置为False才能生效，不然不起作用 同时Windows下不支持同时开启多进程，所以在win下使用processes无效 """ # app.run(host...翻译：猴子补丁仔细的用并行代码副本替换标准socket模块的函数和类，这种方式可以使模块在不知情的情况下让gevent更好的运行于multi-greenlet环境中。...---- Flask 依赖两个外部库： Jinja2 模板引擎和 Werkzeug WSGI 套件 @flask_script扩展安装：pip install flask-script 说明：在项目测试完成后

4.6K3 0

Redis为什么这么快？

因为它读写速度极快，一般用于缓存热点数据加快查询速度，大家在工作里面也肯定和 Redis 打过交道，但是对于Redis 为什么快，除了对八股文的背诵，好像都还没特别深入的了解。...本文暂时按下不表，后续会针对以上所有数据结构进行源码级深入分析单线程vs多线程 Talk is cheap,Show me the code 如下代码演示了串行和并发执行并累加操作的时间：...硬盘数据库读取流程内存数据库读取流程 IO多路复用是最常使用的IO模型，但是其异步程度还不够“彻底”，因为它使用了会阻塞线程的select系统调用。...因此IO多路复用只能称为异步阻塞IO，而非真正的异步IO。异步IO模型 “真正”的异步IO需要操作系统更强的支持。...如下展示了异步 IO 模型的运行流程(Proactor设计模式)：用户进程发起read操作之后，立刻就可以开始去做其他的事；而另一方面，从内核的角度，当它收到一个异步的read请求操作之后，首先会立刻返回

4653 0

Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to th

文章目录 1、问题描述： 2、原因分析： 3、解决方案： 1、问题描述：今天在谷歌浏览器的控制台中发现个警告：Synchronous XMLHttpRequest on the main thread...is deprecated because of its detrimental effects to th 我翻译了下：主线程上的同步XMLHttpRequest已被弃用，因为它会对最终用户的体验产生不利影响...2、原因分析：一个是Ajax请求分异步和同步2种模式。如果请求是同步的，在请求返回之前线程会一直阻塞，如果请求是在主线程中发起的，那就会造成整个浏览器阻塞。...3、解决方案：我们看下页面中是否有同步的ajax请求，我们将其改为异步请求即可，因为同步请求会锁住浏览器，得等到同步请求相应之后才能执行其他操作。...在ajax中设置: async:true //异步请求

4492 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭