Angular chart js如何在圆环图中使用格式化程序

npm install chart.js ng2-charts --save

import { Component } from '@angular/core';
import { ChartOptions, ChartType, ChartDataSets } from 'chart.js';
import { Label } from 'ng2-charts';

@Component({
  selector: 'app-pie-chart',
  templateUrl: './pie-chart.component.html',
  styleUrls: ['./pie-chart.component.css']
})
export class PieChartComponent {
  public pieChartOptions: ChartOptions = {
    responsive: true,
    legend: {
      position: 'top',
    },
    plugins: {
      datalabels: {
        formatter: (value, ctx) => {
          // 在这里可以编写自定义的格式化程序
          return value + '%';
        },
      },
    }
  };
  public pieChartLabels: Label[] = ['Red', 'Blue', 'Yellow'];
  public pieChartData: number[] = [30, 50, 20];
  public pieChartType: ChartType = 'pie';
  public pieChartLegend = true;
  public pieChartPlugins = [];
}

<div style="display: block">
  <canvas baseChart
          [data]="pieChartData"
          [labels]="pieChartLabels"
          [chartType]="pieChartType"
          [options]="pieChartOptions"
          [legend]="pieChartLegend"
          [plugins]="pieChartPlugins">
  </canvas>
</div>