typescript - ¿Cómo mostrar datos en un gráfico de pastel en Angular 2 usando ng2-charts?

Como en fig, puedo implementar un gráfico circular, pero ¿cómo mostrar los datos en el gráfico?

así:

<canvas baseChart  class="pie"
  [data]="Data"
  [labels]="Labels"
  [colors]="Colors"
  [chartType]="pieChartType">
</canvas>

 public Labels:string[]=['Female','Male'];
 public Data:any =[51,30];
 public pieChartType:string = 'pie';
 public Colors:any = 
 [
{
  backgroundColor: [      
  'green',
  'red'
  ]
  }
]; 

Respuesta #1

Primero necesitas ejecutar dos comandos de npm

npm install ng2-charts --save

npm install chart.js --save

Importante: ¡Incrustar Chart.js en la aplicación es obligatorio! en tu index.html

<script src="node_modules/chart.js/src/chart.js"></script>

Importa este en App.module.ts

import { ChartsModule } from 'ng2-charts';
imports: [ChartsModule]

Componente.html

<div style="display: block">
  <canvas baseChart
          [data]="pieChartData"
          [labels]="pieChartLabels"
          [chartType]="pieChartType"
          (chartHover)="chartHovered($event)"
          (chartClick)="chartClicked($event)"></canvas>

Componente.ts

public pieChartLabels: string[] = ['Male', 'Female'];
  public pieChartData: number[] = [51, 30];
  public pieChartType: any = 'pie';

  // events
  public chartClicked(e: any): void {
    console.log(e);
  }

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

este código está funcionando como esperas.