Primeng饼图不显示

Question

我想在仪表板屏幕中显示饼图。 遵循primefaces网站中的示例。但它不起作用。 以下是我的代码。请让我知道我是否缺少任何进口产品。

app.module.ts

import {ChartModule} from 'primeng/primeng'; 

    @NgModule({ 
    -- 
    -- 
    imports: [ 
    -- 
    -- 
    ChartModule 

component.ts

piedata: any; 


ngOnInit() { 

    this.piedata = { 
      labels: ['A','B','C'], 
      datasets: [ 
       { 
        piedata: [300, 50, 100], 
        backgroundColor: [ 
         "#FF6384", 
         "#36A2EB", 
         "#FFCE56" 
        ], 
        hoverBackgroundColor: [ 
         "#FF6384", 
         "#36A2EB", 
         "#FFCE56" 
        ] 
       }] 
      }; 
} 

Html页面

<p-chart type="pie" [data]="piedata"></p-chart> 

**输出**

Answer 1

你需要chart.js之为它function.do

npm install chart.js --save 

，包括在你的角cli.json文件

"scripts": [ 
"../node_modules/chart.js/dist/Chart.js", 
//..others 
], 

希望这有助于

更新：试试这个

ngOnInit() { 

    this.piedata = { 
      labels: ['A','B','C'], 
      datasets: [ 
       { 
        data: [300, 50, 100], 
        backgroundColor: [ 
         "#FF6384", 
         "#36A2EB", 
         "#FFCE56" 
        ], 
        hoverBackgroundColor: [ 
         "#FF6384", 
         "#36A2EB", 
         "#FFCE56" 
        ] 
       }] 
      }; 
}