Mam kątową 2 usługi, pobrać dane z API usługa ta 3 abonentów (zdefiniowanego w komponenty) każdy robi coś innego z danymi (różne wykresy)kątowa 2 Obserwowalne z wieloma abonentami
jestem zauważając, że wykonuję trzy żądania GET do API, podczas gdy to, co chcę osiągnąć, to jedno żądanie i że subskrybenci będą udostępniać dane Rozglądam się za HOT i COLD obserwowalnym i wypróbowałem .share() na obserwowalnym, ale Wciąż wykonuję 3 indywidualne połączenia
Aktualizacja, dodawanie kodu
usługi
import { Injectable } from '@angular/core';
import { Http, Response } from '@angular/http';
import {Observable} from 'rxjs/Rx';
// Import RxJs required methods
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';
import { StationCompliance } from './model/StationCompliance';
@Injectable()
export class StationComplianceService {
private url = '/api/read/stations';
constructor(private http : Http) {
console.log('Started Station compliance service');
}
getStationCompliance() : Observable<StationCompliance []> {
return this.http.get(this.url)
.map((res:Response) => res.json())
.catch((error:any) => Observable.throw(error.json().error || 'Server Error'));
}
}
Komponent 1
import { Component, OnInit } from '@angular/core';
import { CHART_DIRECTIVES } from 'angular2-highcharts';
import { StationComplianceService } from '../station-compliance.service';
@Component({
selector: 'app-up-down-graph',
templateUrl: './up-down-graph.component.html',
styleUrls: ['./up-down-graph.component.css']
})
export class UpDownGraphComponent implements OnInit {
graphData;
errorMessage: string;
options;
constructor(private stationService : StationComplianceService) { }
ngOnInit() {
this.getStationTypes();
}
getStationTypes(){
this.stationService.getStationCompliance()
.subscribe(
graphData => {
this.graphData = graphData;
this.options = {
chart : {type: 'pie',
plotShadow: true
},
plotOptions : {
showInLegend: true
},
title : {text: 'Up and Down devices'},
series: [{
data: this.processStationType(this.graphData)
}]
}
},
error => this.errorMessage = <any>error
);
}
Pozostałe dwa składniki są prawie takie same, po prostu pokazać inny wykres
Dzięki kod naprawdę pomogło mi – naoru
I ciągnął mnie za włosy na temat tego „problemu”, a ten post made my day. Dzięki – sjosen
Proszę rozważyć krótsze rozwiązanie: https://stackoverflow.com/questions/39627396/angular-2-observable-with-multiple-subscribers/48803113#48803113 – zeliboba