图表JS条形图用作变量时未呈现

Question

我正在使用chart.js（条形图）开发具有角度的仪表板。当以硬编码值给出图表的数据集时，可以正确呈现图表，但是当将其用作变量时，根本不会呈现图表。

下面是我用于图表的代码。

    import { Component, OnInit } from '@angular/core';
import { Router, ActivatedRoute } from '@angular/router';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { first } from 'rxjs/operators';

import { AlertService, AuthenticationService, PatientService } from '../../_services';
import { PatientActivity } from '../../_models/PatientActivity';
import { PatientSession } from '../../_models/PatientSession';

@Component({
  templateUrl: 'chartjs.component.html'
})

export class ChartJSComponent implements OnInit{
  patientActivity: PatientActivity;
  patientSession: PatientSession;
  loading = false;
  maxPainSum = []
  sessionDate = [];

  constructor(
    private formBuilder: FormBuilder,
    private route: ActivatedRoute,
    private router: Router,
    private authenticationService: AuthenticationService,
    private alertService: AlertService,
    private patientService: PatientService) {}


    ngOnInit() {

      this.patientService.getAllPatientSessionResult().pipe(first()).subscribe(data=>{
        this.patientSession = data;
        this.maxPainSum  =  this.patientSession.maxPainSum;
          },
          error => {
              this.alertService.error("Server Error"); //error
              this.loading = false;
          });


  }
  // lineChart
  public lineChartData: Array<any> = [
    {data: [65, 59, 80, 81, 56, 55, 40], label: 'Series A'},
    {data: [28, 48, 40, 19, 86, 27, 90], label: 'Series B'},
    {data: [18, 48, 77, 9, 100, 27, 40], label: 'Series C'}
  ];
  public lineChartLabels: Array<any> = ['January', 'February', 'March', 'April', 'May', 'June', 'July'];
  public lineChartOptions: any = {
    animation: false,
    responsive: true
  };


  // barChart
  public barChartOptions: any = {
    scaleShowVerticalLines: false,
    responsive: true
  };
  public barChartLabels: string[] = ['2006', '2007', '2008', '2009', '2010', '2011', '2012'];
  //public barChartLabels: string[] = this.sessionDate;
  public barChartType = 'bar';
  public barChartLegend = true;

  public barChartData: any[] = [
    //Using variable is not working
    //{data: [this.maxPainSum] , label: 'Maximum Pain By Date'}
    //This hard coded value is working for bar chart
    {data: [10, 5 , 20, 40, 60] , label: 'Maximum Pain By Date'}

  ];
  public chartHovered(e: any): void {
    console.log(e);
  }
}

下面是我的模特

    export class PatientSession {
       maxPainSum:Array<Number>;
       sessionDate:string;
    }

下面是通过API收到的示例响应

{"maxPainSum":[10,6,12,12,36,4,2,2,8,4,4],"sessionDate":["2018-05-13","2018- 
05-31","2018-06-12","2018-06-20","2018-06-26","2018-06-27","2018-06- 
28","2018-07-16","2018-07-17","2018-08-28","2018-08-29"]}

是新手吗？