无法读取未定义得属性“map”.Angular-ChartJs

Question

这是app.component.ts

import { Component } from '@angular/core';
import { GraficaService } from './services/grafica.service'
import { Chart } from 'chart.js';




@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'yoga';
  chart = [];

  constructor( private _grafica: GraficaService){}

  ngOnInit(){
    this._grafica.graficoEstadistico()
     .subscribe(res => {

        let temp_max = res['list'].map(res => res.main.temp_max)
        let temp_min = res['list'].map(res => res.main.temp_min)
        let alldates = res['list'].map(res => res.dt)

        let weatherDates = []

        alldates.forEach((res) => {
          let jsdate = new Date(res * 1000)
          weatherDates.push(jsdate.toLocaleTimeString('en'), {year: 'numeric', month:'short',day:'numeric'})         
        });

        console.log(weatherDates);

        this.chart = new Chart('canvas',{
          type: 'line',
          data: {
            labels: weatherDates,
            datasets: [
              {
                data: temp_max,
                borderColor: '#3cba9f',
                fill:false

              },
              {
                data: temp_min,
                borderColor: '#ffcc00',
                fill:false

              },
            ]
          },

          options: {
            legend:{
              display:false
            },
            scales:{
              xAxes:[{
                display: true
              }],
              yAxes:[{
                display: true
              }]
            }
          }
        })


     })


    // Yo puedo presentar mi json por consola ,asi . De manera continuada al this
    //.subscribe(res => console.log(res))

  }
}

我目前正在一个ANGULAR项目中使用“ChartJs”库来生成统计图，但当在控制台中运行该项目时，我得到以下错误：错误类型错误：无法读取未定义的属性“map”，有什么解决方案？

core.js:15714错误类型错误：无法读取SafeSubscriber._next(app.component.ts:22)在SafeSubscriber.push../Node_modules/RXJS/_ESM5/Internal/Subscriber.js.SafeSubscriber.__tryorunsub(subscriber.js:196)在SafeSubscriber.push../Node_modules/RXJS/_ESM5/Internal/Subscriber.js.safeSubscriber.next(subscriber.js:134)在Subscriber.push./Node_modules/RXJS/_ESM5/Internal/Subscriber.js.subscriber.next(subscriber.js:134)未定义的属性“map js:77)在subscriber.push../node_modules/rxjs/_esm5/internal/subscriber.js.next(subscriber.js:54)在mapsubscriber.push./node_modules/rxjs/_esm5/internal/operators/map.js.mapsubscriber._next(map.js:41)在mapsubscriber.push./node_modules/rxjs/_esm5/internal/subscriber.js.next(subscriber.js:54)在filterSubscriber上的ber.push../node_modules/rxjs/_esm5/internal/subscriber.js.subscriber.next(subscriber.js:54)。push../node_modules/rxjs/_esm5/internal/operators/filter.js.filtersubscriber._next(filter.js:38)

Answer 1

您使用map函数的唯一地方是在res['list']表示，当您获得res时，它上没有list属性。

要进行调查，请在subscribe的开头执行console.log(res)并观察其中的内容。

同样，作为注释，防止使用shadowed变量（res在map和函数中），这样您就可以将其更改为

在>res['list'].map（r=>r.main.temp_max)之后

和另一个改进>res.list.map（r=>r.main.temp_max)