Question

我有一个从API中提取数据的服务

import { IStats } from './istats';
export class WebService {
  BASE_URL = 'http://localhost:3000/api';
  public stats = new BehaviorSubject<IStats>({
    date: this.datePipe.transform(new Date(), 'dd-MM-yyyy'),
    answeringMachine:0,
    hangUp:0,
    conversations:0
  });

  constructor(private http: HttpClient, private datePipe: DatePipe) {
    this.getStatsbyDate('04-03-2018');
    // this.getStatsbyDate(this.datePipe.transform(new Date(), 'dd-MM-yyyy'));
  }
  getStatsbyDate(date) {
    this.http.get<IStats>(this.BASE_URL + '/stats/' + date)
      .subscribe((data: IStats) => {
        this.stats.next(data);
      });
  }

然后我有一个组件在服务中订阅了BehavioralSubject。

export class StatsComponent {
  private stats: IStats;
  constructor(private webService: WebService, private datePipe: DatePipe)     {
    this.stats = this.webService.stats.getValue();
  }

我认为如果后端API没有任何数据，那么behavioralSubject会返回默认值，这个默认值现在可以使用，但是如果后端确实有数据通过，那么它应该是否应该替换默认值使用API的值？我在这里做错了吗？请指教！

Answer 1

我能够在组件代码上进行一些更改

export class StatsComponent {
  private stats: IStats;
  constructor(private webService: WebService, private datePipe: DatePipe) {
    this.webService.stats$.subscribe(data => {
      if (data !== null) { this.stats = data; }  
      else { this.webService.stats$.next(this.stats); }
    })
  }

通过这种方式，如果API中没有数据，BehavioralSubject会提供服务的默认值，反之亦然。

Angular BehavioralSubject无法按预期工作

1 个答案: