I have the following problem. In my Angular6 service I have a a Http-Get request. And i want to add the result to my store. But the tap
-operator in my pipe is never called.
When i debug on chrome I see that my http request is executed but the pipe is never called what do i wrong.
import { Injectable } from '@angular/core';
import { Budget, BudgetHistory } from '../../class/budget';
import { HttpClient } from '@angular/common/http';
import { PlatformLocation } from '@angular/common';
import { HistoryOfBudget } from '../../class/budget';
import { Observable } from 'rxjs';
import {ADD,LOAD,Store} from '../../class/store';
import { map, take, merge, switchMap, switchAll, tap, debounceTime } from 'rxjs/operators'
//Get access to localStorage
export const BudgetKey : string = "budget";
@Injectable({
providedIn: 'root'
})
export class BudgetserviceService {
private baseUrl : string;
private http : HttpClient;
private budgetStore : Store<Budget> = new Store<Budget>();
private historyStore : Store<HistoryOfBudget> = new Store<HistoryOfBudget>();
public buget$ : Observable<Budget>;
public history$ : Observable<HistoryOfBudget>;
constructor(platformLocation : PlatformLocation, http : HttpClient) {
this.baseUrl = (platformLocation as any).location.origin;
this.http = http;
this.buget$ = this.budgetStore.items$;
this.history$ = this.historyStore.items$;
}
public LoadHistory() : Observable<HistoryOfBudget>{
return this.http.get<HistoryOfBudget>(this.baseUrl + '/api/history').pipe(
tap((loadedHistory) => {
let his = new HistoryOfBudget();
his.budget = loadedHistory.budget;
his.historyList = loadedHistory.historyList;
this.historyStore.dispatch({type: LOAD, data: his});
}));
}
}
So the line
let his = new HistoryOfBudget();
is never be hitten in chrome debugger.
What did I wrong?
Update:
This is where i call it.
export class UebersichtComponent implements OnInit {
private bs : BudgetserviceService;
public history$: Observable<HistoryOfBudget>;
constructor(bs : BudgetserviceService) {
this.bs = bs;
this.history$ = this.bs.history$;
this.bs.LoadHistory();
}
ngOnInit() {
}
}
And this is where I subscriped to the Observable
<div *ngIf="(history$ | async) as history; else loading">
<div *ngFor="let his of history.historyList">
....
</div>
</div>
Update 2:
I also try this
public LoadHistory(){
this.history$ = this.http.get<HistoryOfBudget>(this.baseUrl + '/api/history').pipe(
tap((loadedHistory) => {
let his = new HistoryOfBudget();
his.budget = loadedHistory.budget;
his.historyList = loadedHistory.historyList;
this.historyStore.dispatch({type: LOAD, data: his});
}));
}