如何返回角度可观察的数字/变量?

问题描述 投票:1回答:1

我有一个角度服务,它调用API并返回大量数据。在相同的GET调用中,我正在执行一些逻辑,以计算每种类型的数量。我的问题很简单,我可以将变量/数字与数据一起发回,甚至可以将其保存到另一个变量并将其发送?

[当我尝试将其作为公共变量保存到服务时,当我尝试将其拉入另一个组件时,它是未定义的。我以为是因为变量是在订阅observable之前访问的,但是我不知道该如何解决?

在下面的代码中,_counts是我要返回的内容,在getPciInfo方法中可以很好地记录日志,但是就像我说的,它在其他任何地方都以未定义的形式返回。 (我正在尝试将此数字传递给其他组件)。

感谢您提供的任何帮助或建议。

public _counts: any;

getPciInfo(): Observable <Ipcidata[]> {
    return this.httpClient.get<Ipcidata[]>('http://dr0-hlp-07/api/PCIMachines')
      .pipe(
              map(results => {

                const sorted = results.sort(( a, b ) => {
                      const updateDateA = Date.parse(this.datepipe.transform(a.UpdatedDate, 'MM-dd-yyyy'));
                      const carda = determineCardType(a, this.dateMinusMonth, this.dateMinusTwoWeeks)
                      const cardb = determineCardType(b, this.dateMinusMonth, this.dateMinusTwoWeeks)

                      return cardb - carda
                });

                this._counts = sorted.reduce((acc, cur)=>{
                  const cardType = determineCardType(cur, this.dateMinusMonth, this.dateMinusTwoWeeks)

                  switch (cardType) {
                    case 1:
                      acc.green += 1;
                      break;
                    case 2:
                      acc.yellow += 1;
                      break;
                    case 3:
                      acc.red += 1;
                      break;
                  }
                  return acc;
                }, {
                  red: 0,
                  green: 0,
                  yellow: 0
                });
                console.log(this._counts)
                console.log(this._counts.red)

          return sorted;
          }


javascript angular typescript service observable
1个回答
2
投票

要发回计数,您可以执行:

return ({sorted, counts: _counts});

要在此服务的各个组件之间共享它,您可以设置一个主题,例如:

private countsSource = new Subject();
private counts = this.countsSource.asObservable();

getPciInfo(): Observable <Ipcidata[]> {
    return this.httpClient.get<Ipcidata[]>('http://dr0-hlp-07/api/PCIMachines')
      .pipe(
              map(results => {
                 ....
                 const counts = ...
                 this.countsSource.next(counts)
              });
}

getCounts(): Observable<CountData> {
     return this.counts;
}

在组件中,您可以像使用其他功能一样使用它

this.myService.getCounts().subscribe(counts => console.log(counts));

如果要将计数发送到新订阅,则可能必须使用BehaviorSubjectReplaySubject

© www.soinside.com 2019 - 2024. All rights reserved.