如何在rxJS中创建一个改变超时后的值的主题?



我有一个像这样实现的零食栏主题,其中消息将在Angular应用中出现4秒:

snackbar = new BehaviorSubject<string | null>(null);
showMessage(message: string) {
this.snackbar.next(message);
setTimeout(() => {
this.snackbar.next(null);
},4000)
}

我想知道是否有可能以一种更像rxjs的方式实现这一点,就像定义后的管道一样,在那里有一个超时,4秒后有一个新值。这是可能的还是我的解决方案是你怎么做的?

Rxjs的实现方式。每次当您发射消息时,它都会与null值发射配对。concatMap将确保您永远不会错过推送到队列的任何消息

import { of, map, Observable, Subject, timer, merge } from 'rxjs';
import { concatMap, mapTo, switchMap } from 'rxjs/operators';
const message = new Subject();
setInterval(() => message.next(Math.random()), 6000);
message
.pipe(concatMap((value) => merge(of(value), timer(4000).pipe(mapTo(null)))))
.subscribe(console.log);

你可以使用这个可观察对象作为snackbar消息的源,message主题将作为消息发射器。

https://stackblitz.com/edit/rxjs-cupp2f?file=index.ts

相关内容

  • 没有找到相关文章

最新更新