在AngularJS中實現chart.js時出錯

Question

我按照鏈接Angular chart JS中給出的步驟進行操作，但是無法從數據中繪制圖形（條形圖）。

我的dashboard.html是

<div class="md-padding" flex layout-sm="column" >
<md-card class="text-center">
<md-card-content>
<canvas id="bar" class="chart chart-bar" ng-controller="DashboardCtrl"chart-data="data" chart-labels="labels" chart-series="series">
</canvas>
</md-card-content>
</md-card>
</div>

我的dashboardctrl.js是

(function () {
'use strict';

angular.module("home", ["chart.js"])
.config(['ChartJsProvider', function (ChartJsProvider) {
 ChartJsProvider.setOptions({
  chartColors: ['#FF5252', '#FF8A80'],
  responsive: false
  });
// Configure all line charts
ChartJsProvider.setOptions('line', {
  datasetFill: false
 });
}])
.controller("DashboardCtrl", ['$scope', function ($scope) {

$scope.labels = ['2006', '2007', '2008', '2009', '2010', '2011', '2012'];
$scope.series = ['Series A', 'Series B'];

$scope.data = [
  [65, 59, 80, 81, 56, 55, 40],
  [28, 48, 40, 19, 86, 27, 90]
];
console.log("done");
}]);
})();

我遇到錯誤

多個指令[ngController，chartBar]在以下位置請求新的/隔離的作用域：

感謝您的幫助。 `

Answer 1

<div class="md-padding" flex layout-sm="column" ng-controller="DashboardCtrl">
   <md-card class="text-center">
      <md-card-content>
         <canvas id="bar" class="chart chart-bar" chart-data="data" chart-labels="labels" chart-series="series"></canvas>
      </md-card-content>
   </md-card>
</div>

您需要將ng-controller移動到另一個元素。 控制器和chartBar指令都嘗試注冊新的隔離范圍，因為錯誤消息顯示