angular - 在 ng-apexchart 上输入未定义的错误以获取角度

Question

请帮助我理解这个错误。

我只是想使用 ng-apexchart 为我的 Angular Web 应用程序创建一个条形图。我正在关注这篇文章。我不确定我做错了什么，但我在组件的 html 文件中遇到错误。

这是在我的 html 中：

<apx-chart [series]="chartOptions.series" [chart]="chartOptions.chart" [title]="chartOptions.title"></apx-chart>

错误出现在 [series] [chart] 和 [title] 上，它说

Type 'ApexAxisChartSeries | undefined' is not assignable to type 'ApexAxisChartSeries | ApexNonAxisChartSeries'.
  Type 'undefined' is not assignable to type 'ApexAxisChartSeries | ApexNonAxisChartSeries'.ngtsc(2322)

另外，我可以只在我的父组件中添加前面提到的文章中的代码，还是我也可以在任何子组件中使用它？

这是我的 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"]
      }
    };

  }


  }

标签： angulartypescriptfrontendmean-stack