Как работать с глобальной переменной и BehaviorSubject / Angular2?

Question

[Alexander Belov]

У меня в приложении есть Catalog Component и Cart Service. Мне нужно добавлять продукты из Catalog Component (они хранятся в массиве объектов в JSON по умолчанию) в переменную Cart (изначально пустой массив).

Этот массмв Cart должен динамически изменяться по добавлению / удалению продукта. Решил для этого использовать { BehaviorSubject }.

Cart Service:

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


@Injectable()
export class CartService {
  public cart = new BehaviorSubject(null);//my globally available Cart

}

Catalog Component:

import { Component, OnInit } from '@angular/core';
import { CatalogService } from './catalog.service';
import { CartService } from '../cart/cart.service';//my globally available Cart imported to the current component

@Component({
  selector: 'catalog',
  templateUrl: './catalog.component.html',
  styleUrls: ['./catalog.component.scss']
})

export class CatalogComponent implements OnInit { 
  catalog: any;
  image: any;
  title: string;
  description: string;
  prod: any;
  visible: boolean;

constructor(public catalogService: CatalogService, public cartService: CartService){ } 

ngOnInit(){

    this.catalogService.getCatalogItems().subscribe(
        (data) => this.catalog = data
    );
}

  toCart(prod){
      this.cartService.cart.subscribe((val) => {
            console.log(val); 
      });

    this.cartService.cart.push(prod);//добавляю новый продукт в массив Cart
  }

}

Консоль выдаёт ошибку:


Как настроить работу с глобальной переменной (массивом) Cart, используя BehaviorSubject?

Answer 1

[Алексей Зуев]

У BehaviorSubject объекта есть метод getValue

this.cartService.cart.next(this.cartService.cart.getValue().push(prod));

Можете посмотреть пример здесь https://github.com/jhades/angular2-rxjs-observable...