Кэширование и связывание HTTP-ответов в BehaviourSubject в AngularJS 2/4

Question

У меня есть 2 родственных компонента, имеющих службу, которая имеет HTTP-вызов для рендеринга JSON. При включении компонент B получает HTTP-ответ, вызывающий службу, и загружает экран. Событие щелчка на компоненте A должно заставить компонент B обновить свои данные.

Я следовал за ответом, опубликованным ObjectiveTC от -> Как правильно передать результат сетевого вызова Angular 2 Http в RxJs 5?

    _docdata: BehaviorSubject<DetailSection[]> = new BehaviorSubject<DetailSection[]>([]);

service.getData(){return  this.http.get(this.url)
        .map((res) =>{this._docdata = (res.json()); console.log("1st return"); return this._docdata; })     
        .catch((error:any) => Observable.throw(error|| 'Server error'));  }

Это работало нормально.

refresh(){
this.http.get("../../assets/reqd-detail.json")
        .map(res => res.json())
        .subscribe((data:Array<DetailSection>) => this._docdata.next(data));
}

получение ошибки -> ОШИБКА TypeError: _this._docdata.next не является функцией в SafeSubscriber._next (detail.service.ts:156) в SafeSubscriber.webpackJsonp.../../../../rxjs/Subscriber.js.SafeSubscriber.__tryOrUnsub (Subscriber.js:238) в SafeSubscriber.webpackJsonp.../../../../rxjs/Subscriber.js.SafeSubscriber.next (Subscriber.js:185) в Subscrison.b.../../../../rxjs/Subscriber.js.Subscriber._next (Subscriber.js:125) в Subscriber.webpackJsonp... /.. /.. /.. / rxjs / Подписчик.js.Subscriber.next (

Answer 1

Код ниже работал нормально для меня.

• Тематические переменные

  _docdata: BehaviorSubject = new BehaviorSubject ([]); docdata: Observable = this._docdata.asObservable ();

  getData () / refresh () {вернуть this.http.get(this.url) .map(res => res.json()) .subscribe((data:DetailSection[]) =>{ this._docdata.next(data);console.log(this._docdata)}, (err: any) => console.error("fetch: ERROR",err), () => console.log("fetch: всегда"));}

• Получил ответ в Компонентах как:

  this.detailService.getPageData (ключ,srcFrom); this.detailService.docdata.subscribe((dataList) => {this.dataList = dataList;console.log("dataList from component",this.dataList);});

Answer 2

Проблема в функции вашей карты: вы переопределяете _docData для объекта ответа (который имеет тип Array), который не так заметен. И это не имеет следующей функции на нем.

Попробуй это

_docdata: BehaviorSubject<DetailSection[]>;

service.getData(){return  this.http.get(this.url)
        .map((res) =>{
             let detailSections = res.json();
             this._docdata = new BehaviorSubject<DetailSection[]>(detailSections); 
             console.log("1st return"); 
             return detailSections; })     
            .catch((error:any) => Observable.throw(error|| 'Server error'));  }