Angular-chartjs expression/value 里面 canvas class

Question

我正在尝试使用 Angular 表达式更改 canvas 的 class，但我无法找出原因。

<canvas class="{{graphType}}"
chart-data="mainCtrl.data" 
chart-labels="mainCtrl.labels" 
chart-options="mainCtrl.options">

我也尝试过 class="{{'graphType'}}"、class="'{{graphType}}'"、class="graphType"、class="mainCtrl.graphType" 和 ng-class="{{graphType}}"，但我无法成功。但是当我使用 class="chart chart-line" 时它工作得很好。

在控制器上我有：

$scope.graphType = 'chart chart-line';

感谢任何帮助。这是 jsfiddle 上的示例：

编辑：依赖关系已修复，但图表仍未显示。 https://jsfiddle.net/223wtffm/

Answer 1

你的 js fiddle 说：

var vm = this;

但应该是：

var vm = $scope;

如果您更改此设置，您的 jsfiddle 会起作用，因为将以下样式放入 css 表明已应用 class 名称

.chart{
  border: 3px solid red;
}

.chart-line{
  background-color: purple;
}

Answer 2

我认为您想使用 angular-chart 从折线图到饼图等更改图表类型。angular-chart 提供不基于 [=18= 的动态变化图表] 但在另一个属性上 chart-type.

这是一个 JsFiddle，我在其中使用超时动态更改图表类型。希望对你有帮助

Angular-chartjs expression/value 里面 canvas class

Angular-chartjs expression/value inside canvas class

javascript

angularjs

chart.js

angular-chart