【问题标题】:I am getting a error like this: "ERROR TypeError: res.Data.map is not a function" in Ionic4我收到这样的错误:Ionic4 中的“ERROR TypeError: res.Data.map is not a function”
【发布时间】:2020-02-23 16:06:26
【问题描述】:

这是我的代码:home.page.ts

 coinDetails(coin, index){
      if(this.detailToggle[index])
      this.detailToggle[index] = false;
      else {
        this.detailToggle.fill(false);

        this._data.getCoin(coin)
        .subscribe(res => {
          this.details = res['DISPLAY'][coin]['USD'];

          this.detailToggle[index]= true;

          this._data.getChart(coin)
          .subscribe(res => {

           let coinHistory = res['Data'].map((a) => (a.close));

            setTimeout(() => {
              this.chart[index] = new Chart ('canvas' + index, {
                type: 'line',
                data: {
                  labels: coinHistory,
                  datasets: [{
                    data: coinHistory,
                    borderColor: '#3cba9f',
                    fill: false
                  }
                ]
              },
                  options: {
                    tooltips: {
                      callbacks: {
                        label: function(tooltipItems,data) {
                          return "$" + tooltipItems.yLabel.toString();
                        }
                      }
                    },
                    reponsive: true,
                    legend: {
                      display: false
                    },
                    scales: {
                      xAxes: [{
                        display: false
                      }],
                      yAxes: [{
                        display: false
                      }],
                    }
                  }
              });
            }, 250);

          });

        });

      }
    }
    }

data.service.ts

  getChart(coin){
    return this._http.get("https://min-api.cryptocompare.com/data/v2/histoday?fsym="+coin+"&tsym=USD&limit=30&aggregate=1&e=CCCAGG")
    .pipe(map(result => this.result = result));
  }

我只想在我的应用程序上显示折线图,并且我在这个过程中存货,它一直显示 ERROR TypeError: res.Data.map is not a function 当我试图显示折线图时。

我希望有人可以帮助我。谢谢各位!

我只是 ionic 家伙的新手,如果有人要帮助我,我将不胜感激

【问题讨论】:

  • 这意味着res['Data'] 不是一个数组。您是否尝试过将该值记录到控制台以查看它是什么?此外,如果要执行this.result = result 之类的操作,最好使用tap 而不是map。这表示您希望执行一个操作作为副作用而不返回不同的值。
  • 另一个仅供参考 - 最好使用 switchMap 而不是创建嵌套订阅。这不是问题的原因,只是提醒一下。

标签: angular ionic-framework ionic4


【解决方案1】:

这意味着从this._data.getChart 返回的对象的Data 属性已定义,但不是数组。您应该尝试记录 res 以查看属性的类型。

我建议重构你的函数。这 2 个订阅可以使用 forkJoin 并行运行,因为它们不相互依赖。

coinDetails(coin, index) {
  if (this.detailToggle[index]) {
    this.detailToggle[index] = false;
    return;
  }

  this.detailToggle.fill(false);

  // forkJoin to run 2 subscriptions in parallel
  forkJoin([
    this._data.getCoin(coin).pipe(
      // let the individual calls update the state they are responsible for maintaining
      tap(res => {
        this.details = res['DISPLAY'][coin]['USD'];
        this.detailToggle[index]= true;
      })
    ),
    this._data.getChart(coin).pipe(
      tap(res => {
        // log the result here to see what the data type is
        console.log(res);
        // ***** ERROR OCCURS HERE *****
        this.coinHistory = res['Data'].map(a => a.close);
      })
    )
  ]).subscribe(() => {
    // not sure why this is in a timeout, but have left it that way
    setTimeout(() => {
      // move update chart functionality into separate function for readability
      // new function not shown as it is irrelevant to the problem
      this.updateChart(index)
    }, 250);
  });
}

【讨论】:

    猜你喜欢
    • 2015-10-11
    • 2017-07-22
    • 2022-12-29
    • 2021-03-28
    • 2020-11-17
    • 2022-10-07
    • 2018-05-09
    • 2017-08-01
    • 2017-09-01
    相关资源
    最近更新 更多