在 Angular 应用程序中,我们执行一个方法。并且我们需要在调用此方法后触发另外两个间隔时间的方法。Method call -> wait 150 ms ----> second action -> wait 300 ms -------- > third action
我可以设置两个嵌套 setTimeout
.它有效,但我觉得它很难看。
public toggleSideContainer() {
this.myLayoutService.toggleSideContainer();
setTimeout(() => {
this.renderer.addClass(this.mainContainer, 'side-container');
setTimeout(() => {
this.renderer.addClass(this.sideContainer, 'open');
}, 300);
}, 150);
}
以正确的 rxjs 方式获得此结果的正确 rxjs 运算符/序列是什么?
最佳答案
Observable.of(true)
.delay(150)
.do(() => {
this.renderer.addClass(this.mainContainer, 'side-container');
})
.delay(300)
.do(() => {
this.renderer.addClass(this.sideContainer, 'open');
});
或者使用新的可出租/可管道运营商:
Observable.of(true).pipe(
delay(150),
tap(() => {
this.renderer.addClass(this.mainContainer, 'side-container');
}),
delay(300),
tap(() => {
this.renderer.addClass(this.sideContainer, 'open');
})
);
来源:https://github.com/ReactiveX/rxjs/blob/master/doc/pipeable-operators.md
关于angular - 用 rxjs 替换两个连续的 setTimeout,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48625049/