Hiding Chart.js labels in Angular6 - chart.js

Question

I used my angular 6 project for the Chart.js
charts is working good, but I want to know how to hide correctly in this doughnutChartLabels and I try to do that legend: {display: false}
but it's not working, anyone know how to do that correctly
.html
<canvas baseChart
[data]="doughnutChartData"
[labels]="doughnutChartLabels"
[options]="doughnutOptions"
[chartType]="doughnutChartType"
(chartHover)="chartHovered($event)"
(chartClick)="chartClicked($event)"></canvas>
</div>
.ts
// Doughnut chart
public doughnutChartLabels:string[] = ['Download Sales', 'In-Store Sales', 'Mail-Order Sales'];
public doughnutChartData:number[] = [350, 450, 100];
public doughnutChartType:string = 'doughnut';
responsive: true;
public doughnutOptions: { percentageInnerCutout: 70 , legend: {display: false}
}// make doughnut chart slim
// events
public chartClicked(e:any):void {
console.log(e);
}
public chartHovered(e:any):void {
console.log(e);
}
}
Thanks

Answer 1

I fixed my issue,
I used this [legend]="doughnutChartLegend"
.html
<canvas baseChart
[data]="doughnutChartData" [labels]="doughnutChartLabels"
[options]="doughnutChartOptions" [legend]="doughnutChartLegend"
[chartType]="doughnutChartType"
[colors]="[{backgroundColor: ['rgb(116, 90, 242)', 'rgb(30, 136, 229)', '#06d79c', 'rgb(236, 239, 241)']}]"
(chartHover)="chartHovered($event)"
(chartClick)="chartClicked($event)"></canvas>
.ts
// Doughnut
public doughnutChartLabels: string[] = [
'Total',
'Vacant Dirty',
];
public doughnutChartOptions: any = {
borderWidth: 2,
maintainAspectRatio: true,
cutoutPercentage: 55,
};
responsive: true;
public doughnutChartData: number[] = [51, 1];
public doughnutChartType: string = 'doughnut';
public doughnutChartLegend: boolean = false;