我收到这个错误，我无法弄清楚，我错过了什么吗？

Question

我正在关注此 article 以处理 angular 中的图表。即使一步一步地跟着它，我仍然收到这个错误。有人可以向我解释错误是什么以及为什么会发生吗？

我的app.component.ts:

import { Component } from '@angular/core';


import {
  ChartComponent,
  ApexAxisChartSeries,
  ApexChart,
  ApexXAxis,
  ApexTitleSubtitle
} from "ng-apexcharts";


export type ChartOptions = {
  series: ApexAxisChartSeries;
  chart: ApexChart;
  xaxis: ApexXAxis;
  title: ApexTitleSubtitle;
};


@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  // @ViewChild("chart") chart: ChartComponent;
  public chartOptions: Partial<ChartOptions>;

  constructor() {

    this.chartOptions = {
      series: [
        {
          name: "My-series",
          data: [10, 41, 35, 51, 49, 62, 69, 91, 148]
        }
      ],
      chart: {
        height: 350,
        type: "bar"
      },
      title: {
        text: "My First Angular Chart"
      },
      xaxis: {
        categories: ["Jan", "Feb",  "Mar",  "Apr",  "May",  "Jun",  "Jul",  "Aug", "Sep"]
      }
    };

  }


  }

这是我的 app.component.html，这是发生错误的地方

Answer 1

错误提示您输入的类型与预期的类型不符。 [title] 期望类型 ApexTitleSubtitle，而你的变量是类型 ApexTitleSubtitle | undefined

我想你会问有什么区别。我认为，这是由于 Partial<>。当您定义一个 Partial 时，您说类型 T 的每个字段都可以是可选的，因此每个字段都可以有一个值或者是 undefined。库组件想要作为输入 ChartOptions 而不是 Partial<ChartOptions>.

如果您希望它起作用，只需删除部分并设置所需的属性

我收到这个错误，我无法弄清楚，我错过了什么吗？

I am getting this error and I can not figure it out, am I missing something?

angular

frontend

mean-stack