在我的 rxjs BehaviorSubject 中合并来自不同来源的值

To merge values from different sources in my rxjs BehaviorSubject

我正在使用 rxjs BehaviorSubject 创建一个服务,在从 Component1 发送值并在 Component3 中订阅时,我在 Component3 中获得了值,这已实现

服务文件

`import { Injectable } from '@angular/core';
 import { Observable } from 'rxjs';
 import { BehaviorSubject } from 'rxjs/BehaviorSubject';

   @Injectable()
   export class UserService {

     constructor() { }

     // Observable navItem source
     public _navItemSource = new BehaviorSubject(undefined);

     // Observable navItem stream
     navItem$ = this._navItemSource.asObservable();

     // service command
     changeNav(nu) {
       this._navItemSource.next([...nu]);
     }
  }`

组件 1

  `this._userService.changeNav(self.notificationslist);`

组件 3

  `this.subscription = this._userService.navItem$.subscribe(item =>   
   this.item1 = item);`

现在我想在另一个组件 (Component2) 中使用相同的服务将一些不同的值发送到相同的组件 Component3

组件 2

 `this._userService.changeNav(this.updatedFlag);`

组件 3

  `this.subscription = this._userService.navItem$.subscribe(item =>   
   this.item1 = item);`

然后在 Component3 上订阅它后,我应该从 Component1 和 Component2 获取所有值。 所以我更新了我的服务文件,但我收到以下错误

caused by: this._navItemSource.asObservable(...).scan is not a function

由于我是 rxjs 的新手,请纠正我哪里出错了。

更新服务文件

`import { Injectable } from '@angular/core';
 import { Observable } from 'rxjs';
 import { BehaviorSubject } from 'rxjs/BehaviorSubject';

 @Injectable()
 export class UserService {

 constructor() {
 }

  // Observable navItem source
  public _navItemSource = new BehaviorSubject(undefined);

  // Observable navItem stream
  navItem$ = this._navItemSource.asObservable().scan((acc, one) =>(acc + 
  one));

  // service command
  changeNav(nu) {
    this._navItemSource.next([...nu]);
  }

}`

确保导入扫描运算符。并在扫描功能中合并您的结果,您可以 return a JSON 与发出的先前值和新值

Working Plunker

import { Injectable } from '@angular/core';
 import { Observable } from 'rxjs';
 import { BehaviorSubject } from 'rxjs/BehaviorSubject';
import "rxjs/add/operator/scan";
 @Injectable()
 export class UserService {

 constructor() {
 }

  // Observable navItem source
  public _navItemSource = new BehaviorSubject(Object([]));

  // Observable navItem stream
  navItem$ = this._navItemSource.asObservable().scan((acc, one) => {
                    return {
                        'previous': acc, 'new': one
                    }
                });

  // service command
  changeNav(nu) {
    this._navItemSource.next([...nu]);
  }

}