Angular 2 Observable Service to return data from localStorage

Question

I am after extending a Observables service to return data from local storage.

Scenario: Component will subscribe to Service.GetAll() and GetAll() will look up in the localStorage for data if found it will return else it will make a api call to get the data.

I managed to do this using Promise, but I prefer to convert it to Observables

getAll(): Promise<IScheduleFrequency[]> {
    let ScheduleFrequencies: IScheduleFrequency[] = this.storageService.get('ScheduleFrequencies');
    if (ScheduleFrequencies != null) {
        return Promise.resolve(ScheduleFrequencies);
    } else {
        return this.http.get(this.apiUrl)
            .toPromise()
            .then((response) => {
                let ScheduleFrequencies: IScheduleFrequency[] = response.json();
                this.storageService.save('ScheduleFrequencies', activityScheduleFrequencies);
                return ScheduleFrequencies || [];
            })
            .catch(this.handleError);
    }
}

Appropriate if some one can show me how I can extend below service to do the same.

getAll(): Observable<TransactionStatus[]> {
    return this.http.get(this.apiUrl)
        .map(this.extractData)
        .catch(this.handleError);
}

Thank you Asanka

Update Thank you @nzjun90 for the reply it works need to import 'of' import 'rxjs/add/observable/of';

nzjun90 nzjun90 · Accepted Answer · 2017-02-06T23:25:50

let me know if you need clarification.

getAll(): Observable<TransactionStatus[]> {
    let ScheduleFrequencies: IScheduleFrequency[] = this.storageService.get('ScheduleFrequencies');

    if (ScheduleFrequencies != null) {
        return Observable.of(ScheduleFrequencies);
    }

    return this.http.get(this.apiUrl)
    .map((response)=>{
              let ScheduleFrequencies: IScheduleFrequency[] = response.json();
              this.storageService.save('ScheduleFrequencies', activityScheduleFrequencies);
              return ScheduleFrequencies || [];
    }).catch( e => {return this.handleError});
}

Angular 2 Observable Service to return data from localStorage

1 Answers