Highchart 未在 ajax 函数 angularjs 中渲染

Question

Highchart 没有渲染来自 ajax 调用的数据。如果我在函数外部使用静态数据$http则高图表正在渲染。高图表未触发。

.html：

<hc-pie-chart title="Browser usage" data="pieData">Placeholder for pie chart</hc-pie-chart>

控制器：

$scope.homeallpcn = function(){
var url = "homechartall";
var data = "";
$http.get(url).then( function(response) {
$scope.pieData = [{
name: "Cancelled",
y: response.c
}, {
name: "Closed",
y: response.cl,
sliced: true,
selected: true
}, {
name: "Open",
y: response.o
}, {
name: "Rejected",
y: response.r
}]
});

}
$scope.homeallpcn();

服务：

mainApp.directive('hcPieChart', function () {
return {
restrict: 'E',
template: '<div></div>',
scope: {
title: '@',
data: '='
},
link: function (scope, element) {
Highcharts.chart(element[0], {
chart: {
type: 'pie'
},
title: {
text: scope.title
},
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: true,
format: '<b>{point.name}</b>: {point.percentage:.1f} %'
}
}
},
series: [{
data: scope.data
}]
});
}
};
})

请给我建议。

Answer 1

一些建议：

1 - 通话后的console.log(response)真的显示数据吗？

2 - 请记住，饼图不能处理字符串数据，因此response.c、response.o和response.r必须是整数或浮点数。