Angular 6 + RxJS 6.0:如何将新元素推送到Observable包含的数组

Question

我正在从块中接收来自firebase服务器的数据,同时渲染数据需要一个坚持observable包含Array的库.我在某种程度上无法将新数据块推送到observable包含的现有数据块数组,

从dataservice我按照主题的下一个调用并尝试添加一个新的calEvent

 this.homeWorkerService.eventSubject.next(calEvent);

在组件中,我有以下代码

events$: Observable<Array<CalendarEvent<any>>>;

和ngOnInit,我正在向它提供数据

this.events$ = this.service.eventSubject.asObservable();

你能否建议我可以通过哪种方式向已经举行活动的观察者添加新活动.

PS:我使用这个 lib来渲染日历并使用remoteDB来渲染事件.

谢谢,

Answer 1

这里的主题是CalendarEvent数组,你必须在next()方法中传递一个CalendarEvent数组.我建议在你的情况下使用BehaviorSubject.这是一个简短的例子:

import { Component } from '@angular/core';
import { Observable, BehaviorSubject, of } from 'rxjs';
import { take } from 'rxjs/operators';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  obsArray: BehaviorSubject<any[]> = new BehaviorSubject<any[]>([]);
  array$: Observable<any> =  this.obsArray.asObservable();

  constructor() {
  }

  ngOnInit() {
    this.addElementToObservableArray('It works');
  }

  addElementToObservableArray(item) {
    this.array$.pipe(take(1)).subscribe(val => {
      console.log(val)
      const newArr = [...val, item];
      this.obsArray.next(newArr);
    })
  }
}

你可以在这里看到一个实例:Stackblitz.

希望能帮助到你!