带有JSON对象的Angular js中的图表

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.9/angular.min.js"></script>

<div ng-app="myApp">
  <!-- 页面内容 -->
</div>

<div ng-app="myApp" ng-controller="myController">
  <!-- 页面内容 -->
</div>

angular.module('myApp', []).controller('myController', function($scope) {
  $scope.chartData = {
    labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
    datasets: [
      {
        label: 'Sales',
        data: [65, 59, 80, 81, 56, 55, 40]
      },
      {
        label: 'Expenses',
        data: [28, 48, 40, 19, 86, 27, 90]
      }
    ]
  };
});

<div ng-app="myApp" ng-controller="myController">
  <canvas id="myChart"></canvas>
</div>

<script>
  var app = angular.module('myApp', []);
  app.controller('myController', function($scope) {
    $scope.chartData = {
      labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
      datasets: [
        {
          label: 'Sales',
          data: [65, 59, 80, 81, 56, 55, 40]
        },
        {
          label: 'Expenses',
          data: [28, 48, 40, 19, 86, 27, 90]
        }
      ]
    };

    var ctx = document.getElementById('myChart').getContext('2d');
    var myChart = new Chart(ctx, {
      type: 'bar',
      data: $scope.chartData
    });
  });
</script>