RXJS
文章平均质量分 64
董厂长
I'm looking for opportunities. If you are interested, please send me a message.
展开
-
ngAfterViewInit( ) to early /// ngFor和异步网络请求导致无法选中目标元素的问题
我使用ngfor来循环出 网络请求的来的数据,但是这个请求是一个 Observable,当我在ngAfterInit中去获取的时候,尚未走到下一个事件循环中(这个事件循环就是网络请求后的赋值),此时查询到dom为null,那么当下一个事件循环后,dom被渲染且赋值,并且同步到html内。这时我对ngAfterInit()中的 querySelecter()方法套上一层 setTimeOut(),是最后执行的事件循环。原创 2023-07-18 22:36:05 · 823 阅读 · 0 评论 -
Angular表单valueChanges属性监听变化
在上面的例子中,我们创建了一个FormControl对象来表示表单中的一个输入框,并使用valueChanges属性来监听它的变化。当用户在Input框中输入文本时,控制台将记录每次值更改的内容。Angular中的表单控件有一个valueChange属性。这个属性返回一个Observables对象,我们可以订阅它以获取表单控件值的变化。使用valueChanges属性能够非常方便地检测表单控件属性的变化,配合RxJS操作符使用也可以实现诸如过滤、节流和去抖等功能。原创 2023-04-23 16:57:11 · 916 阅读 · 0 评论 -
angular 父子组件通过服务 + rxjs来传递数据的例子
需要注意的是,如果子组件在父组件之前初始化,则可能会丢失一些数据。为了解决这个问题,可以在。这样,当父组件中的数据发生变化时,子组件中的数据也会随之更新。看到一个很有意思的写法,使用RXJS + service 在父子间传递数据。对象来存储数据,这样可以在子组件初始化时获取最新的数据。的服务,并在其中定义一个。在这个例子中,父组件中的。方法来获取数据,并使用。原创 2023-03-27 23:54:30 · 245 阅读 · 0 评论 -
RXJS基础:函数柯里化 curry
1.延时计算,又叫惰性求值。柯里化后的 函数是分步执行的,前几次调用均返回一 个函数,累积传入的参数,最后调用才会 计算,起到延时计算的作用。如bind函 数,改变this指向但并不执行,只返回函。先完成部分传参, 创建新的函数返回,在需要的时候传入其余的参数调用执行。当多次调用同一个函数,并 且传递的参数绝大多数是相同的时候。提前将易变因素传参 定下来,生成一个更明确的应用函数。原创 2022-12-11 22:28:21 · 122 阅读 · 2 评论 -
关于RXJS,何时需要取消订阅 / 可观测对象的冷热之分
在 component 之间通信,我们会用到 Subject,BehaviorSubject,AsyncSubject,ReplaySubject 这四种 subject,它们都是Hot Observable,Hot Observable 不管有没有被订阅都会源源不断的发送值。在用这些操作符,比如 take(1),拿到 Observable 发送的第一个值之后,RxJs 会主动的停止当前的 Observable,也就是销毁当前 Observable,并不需要手动再调用 unsubscribe()取消订阅。原创 2022-08-19 10:55:57 · 605 阅读 · 0 评论 -
RXJS概念的个人理解:响应式编程思想, 及其参照表(非常有用! )
Observables是多个值的惰性推送集合。它填补了下面表格中的空白首先理解pull和push。pull直接理解为使用者主动拿来用。push理解为数据发送者推送出去,使用者等待数据流动到,并且接受。那么observable就是多个值的推送合集,或者直白粗暴理解,多个promise的集合。.....................原创 2022-07-20 14:52:35 · 1205 阅读 · 0 评论 -
RXJS:串联请求的使用
from的作用:axios返回的是一个promise,我们需要一个可观察对象,所以需要。switchMap 总是会抛弃前一个请求的结果,concatMap不会。pluck的作用:选择属性来发出,主要是用来提取嵌套的属性。很常见的场景,先获取用户的Token再获取用户信息。最后打印出的是最后一个数据流发出的数据。操作符把promise转为可观察对象。也是创建了一个可观察对象。原创 2022-11-03 15:31:32 · 682 阅读 · 0 评论 -
RXJS:通过实例DEMO来直观理解RXJS的运作方式
需要注意的是 观察者对象有三个object:next error complet。加一点魔法,ES6结构赋值,公司代码经常会看见有人这么写,只能说对新手不太友好啊。tips:RXJS所有的API都只会来自 rxjs和rxjs.operators。简单理解:看作一个事件发射器,或者一个代理Agent。只是作为多播的一个中转站。回传的订阅对象就是subscription。简单理解:这一整个过程。将Observable的。原创 2022-08-22 23:44:39 · 217 阅读 · 0 评论 -
RXJS解决NGZORRO下拉框组件漂移的问题
Subscription是一个对象,表示一种可被处置的资源,通常指代一个Observable流的执行过程。Subscription有一个重要的方法unsubscribe(),不需要参数,仅仅用来释放掉subscription实例所...问题描述:使用Angular+NGZORO时候,组件库的下拉框或时间选择框会出现滚动页面,然后漂移的问题。实际的想法是,滚动页面的时候,要么下拉框消失,要么随着页面滚动。那么想法就是,当用户滚动的时候会发出一个流stream,以此创建一个可观察对象observable。...原创 2022-08-11 09:38:21 · 584 阅读 · 2 评论 -
关于ZONE.js / 复习一下RXJS的subject
Zone.js将会对每一个异步操作创建一个task。一个task运行于一个Zone中。通常来说,在Angular应用中,每个task都会在“Angular”Zone中运行,这个Zone被称为NgZone。一个Angular应用中只存在一个AngularZone,而变更检测只会由运行于这个NgZone中的异步操作触发。......原创 2022-07-14 21:20:41 · 363 阅读 · 0 评论 -
Angular使用指令配合RXJS使用节流throttle
之前说起节流防抖,都是在事件内部用RXJS处理的(最开始写的是原生,设定计时器和开关)。后来看到别人把节流防抖放在 Angular 指令 Directives里,并且使用@output装饰器触发元素的指定事件。太妙了。...原创 2022-07-05 21:40:00 · 1034 阅读 · 3 评论 -
Q&A:observable and Subject
概念区别和常见的错误理解辩证:1. Observable 是一条 "水管蓝图" ,每次打开水龙头,水流会按照设计好的路线流向终点。起点和终点一一对应。每次打开水流,都是新的流,水流之间互不影响。一次一管。2. subject 也是一个水流蓝图,但是只是被设计了一部分,如果有人想用水,把自己家水管接上去,就有水了。 换句话说,起点和重点是一对多关系。Subject继承了Observable类别,并且给予了更多不同的特性,因此我们会说Subject也是另外一种Observable。但是Subject和 Obse原创 2022-12-07 14:16:47 · 219 阅读 · 0 评论 -
ReactiveX与非同步式及串流
简单理解,就是将一段60min的影片,切片为30份,每份两分钟,形成“串流”,那么当你跳到40分钟的时候,影片不需要加载完前39分钟的内容,而是找到与之相邻的最近的一块切片,也就是“一段流”,直接下载这段流,节约时间和资源 。在解决同步异步的问题上,ReactiveX对于任何发生的事件都当作串流(stream)网页上的鼠标点击事件就是一连串时间的串流,除非网页关闭,否则这个时间就是会持续发生的。 同理,HTTP请求也是一个串流,只不过这种串流只发生一次。再甚至是处理一个数组,可以将数组的每个元素想成串流的一原创 2022-12-05 15:07:42 · 188 阅读 · 0 评论