RxJS 将 observable 附加到 typescript 中的 observable 数组列表

Posted

技术标签:

【中文标题】RxJS 将 observable 附加到 typescript 中的 observable 数组列表【英文标题】:RxJS append observable to observable array list in typescript 【发布时间】:2018-07-18 12:59:36 【问题描述】:

如何将Observable<News> 添加到 observable 数组中?

newsArray: Observable<Array<any>>;

addNews(newsId: number) 
   let news = this.newsService.getNewNews(newsId); // this returns a Observable<News> type.

  //I want to add `news` to `newsArray` to display it in UI.

html

<li *ngFor="let item of (newsArray | async)">
  <div>item.Id: item.DataValue</div>
</li>

还有其他要使用的运算符吗?

我尝试了BehaviourSubject,但它一次只显示一个值。我想显示添加到数组中的添加项。

【问题讨论】:

【参考方案1】:

您可以使用扫描来积累新闻

news$:Observable<any>
loadMore$=new Subject<number>()

ngOnInit()
 this.news$=this.loadMore$
 .switchMap((newsId)=>this.newsService.getNewNews(newsId))
 .scan((acc,curr)=>
    acc.push(curr)
    return acc
 ,[]).startWith(null)


addNews(newsId: number) 
  this.loadMore$.next(newsId);

HTML

<li *ngFor="let item of (news$ | async)">
  <div>item.Id: item.DataValue</div>
</li>

【讨论】:

但我想在按钮点击事件上添加新闻,还有一个 NewsId 我想根据该新闻将其传递给 API。

以上是关于RxJS 将 observable 附加到 typescript 中的 observable 数组列表的主要内容,如果未能解决你的问题,请参考以下文章

Rxjs 6 等效于 Observable.create(subscriber -> ...).share()

在RxJS中,Observer是否被注入到Observable执行中?

RxJS:如何将 Observable<Observable<Thing>> 转换为 Observable<Thing[]>

RxJS:我将如何“手动”更新 Observable?

RxJS 5,将 observable 转换为 BehaviorSubject(?)

RxJs Observable:如果为空/过滤则执行函数