将普通变量转换为Observable

时间:2017-05-19 09:11:42

标签: angular rxjs observable angular2-services

我的服务中有这个:

float32

以上代码完美无缺。我想要的是当我修改import { Injectable, EventEmitter } from '@angular/core' import { Response } from '@angular/http' import { Observable, ReplaySubject } from 'rxjs/Rx'; import { AppSettings, HttpClient } from './shared'; import _ from "lodash"; @Injectable() export class UserService { private currentTruckTrailer: any; private trucksTrailers: any; public truckTrailerModified$: ReplaySubject<any>; constructor(private http: HttpClient) { this.truckTrailerModified$ = new ReplaySubject(1); } clearCache() { this.currentTruckTrailer = null; this.trucksTrailers = null; } login(username: string, password: string, clientID: number): Observable<any> { return this.http.post(`${AppSettings.API_ENDPOINT}/User/Login`, { username: username, password: password, clientID: clientID }).map((response: Response) => { return response.json(); }); } getTrailersAndTrucks(): Observable<any> { if (this.trucksTrailers) { return Observable.of(this.trucksTrailers); } else { return this.http.get(`${AppSettings.API_ENDPOINT}/User/GetTrailersAndTrucks`).map((response: Response) => { if (response.status == 200) { this.trucksTrailers = response.json(); return this.trucksTrailers; } else { return "FAILURE"; } }); } } saveTrailerAndTruck(truckID: string, trailerID: string): Observable<any> { return this.http.post(`${AppSettings.API_ENDPOINT}/User/SaveTrailerAndTruck`, { truckID: truckID, trailerID: trailerID }).map((response: Response) => { var truck = _.find(this.trucksTrailers.Trucks, function (item: any) { return item.ID == truckID; }); var trailer = _.find(this.trucksTrailers.Trailers, function (item: any) { return item.ID == trailerID; }); this.currentTruckTrailer = { Truck: truck, Trailer: trailer }; this.truckTrailerModified$.next(this.currentTruckTrailer); return response.json(); }); } getCurrentTruckAndTrailer() { if (this.currentTruckTrailer) { return Observable.of(this.currentTruckTrailer); } else { return this.http.get(`${AppSettings.API_ENDPOINT}/User/GetCurrentTruckAndTrailer`).map((response: Response) => { if (response.status == 200) { this.currentTruckTrailer = response.json(); return this.currentTruckTrailer; } else { return "FAILURE"; } }); } } } this.currentTruckTrailer时,订阅者应该自动更改其值。目前我使用公共ReplaySubject saveTrailerAndTruck来广播订阅。问题是如何将truckTrailerModified$: ReplaySubject<any>;转换为Observable,以便侦听器可以直接订阅它。我需要在this.currentTruckTrailersaveTrailerAndTruck内进行哪些更改。

1 个答案:

答案 0 :(得分:2)

您可以使用BehaviorSubjectdocumentation):

首先,你必须初始化它:

currentTruckTrailer:BehaviorSubject<any> = new behaviorSubject<any>();

如果要存储下一个数据值,可以使用next()

this.currentTruckTrailer.next({ Truck: truck, Trailer: trailer });

当您订阅此Observable时,您将收到最后存储的值(如果存在),并且每次拨打next()时都会收到您的订阅者。

修改 以下是您的服务中的示例实现。由于我不知道上下文以及您希望如何使用此服务,因此这可能不是您可以获得的最佳实现。此示例的目的是向您展示如何实现它。

import {Injectable} from '@angular/core'
import {Response} from '@angular/http'
import {Observable, BehaviorSubject} from 'rxjs/Rx';
import {AppSettings, HttpClient} from './shared';
import _ from 'lodash';

@Injectable()
export class UserService {

    private currentTruckTrailer: BehaviorSubject<any> = new BehaviorSubject<any>();
    private trucksTrailers: BehaviorSubject<any[]> = new BehaviorSubject<any[]>();

    constructor(private http: HttpClient) {
        //First of all, we initialize the currentTruckTrailer with a value coming from http.
        this.http.get(`${AppSettings.API_ENDPOINT}/User/GetCurrentTruckAndTrailer`)
            .subscribe((response: Response) => {
                this.currentTruckTrailer = new BehaviorSubject<any>(response.json());
            });

        //Same for truckTrailers.
        this.http.get(`${AppSettings.API_ENDPOINT}/User/GetTrailersAndTrucks`)
            .subscribe((response: Response) => {
                this.trucksTrailers = new BehaviorSubject<any[]>(response.json());
            });
    }

    login(username: string, password: string, clientID: number): Observable<any> {
        return this.http.post(`${AppSettings.API_ENDPOINT}/User/Login`, {
            username: username,
            password: password,
            clientID: clientID
        }).map((response: Response) => {
            return response.json();
        });
    }

    getTrailersAndTrucks(): Observable<any> {
        return this.trucksTrailers;
    }

    saveTrailerAndTruck(truckID: string, trailerID: string): Observable<any> {
        return this.http.post(`${AppSettings.API_ENDPOINT}/User/SaveTrailerAndTruck`, {
            truckID: truckID,
            trailerID: trailerID
        }).do(() => {

            const truck = _.find(this.trucksTrailers.Trucks, function (item: any) {
                return item.ID == truckID;
            });

            const trailer = _.find(this.trucksTrailers.Trailers, function (item: any) {
                return item.ID == trailerID;
            });

            this.currentTruckTrailer.next({Truck: truck, Trailer: trailer});
        }).map(response => {
            return response.json();
        });
    }

    getCurrentTruckAndTrailer(): Observable<any> {
        return this.currentTruckTrailer;
    }
}