Angular-Chart nicht Rendering gemäß Beispiel

Question

Hallo, ich habe Probleme Laden Winkeldiagramm mit, ich bin eines der Beispiele des Ringdiagramm mit und hier ist, was ich habe:

HTML

<div> 
    <canvas id="doughnut" class="chart chart-doughnut" 
     chart-data="data" chart-labels="labels"></canvas> 
</div> 

ich verwende oczlazyloading: Meine config:

angular.module('app') 
    .config(['$ocLazyLoadProvider', function($ocLazyLoadProvider) { 
     $ocLazyLoadProvider.config({ 
      debug: true, 
      events: true, 
      modules: [{ 
       name: 'chart.js', 
        files: [ 
         'assets/plugins/angular-charts/Chart.min.js', 
         'assets/plugins/angular-charts/angular-chart.min.js' 
        ] 
      } 

... 

Mein ui Router Zustand config:

.state('app.dashboard', { 
        url: "/dashboard", 
        templateUrl: "tpl/dashboard.html", 
        controller: 'DashboardCtrl', 
        resolve: { 
         deps: ['$ocLazyLoad', function($ocLazyLoad) { 
          return $ocLazyLoad.load([ 
            'nvd3', 
            'mapplic', 
            'rickshaw', 
            'metrojs', 
            'sparkline', 
            'skycons', 
            'switchery', 
            'chart.js' 
           ], { 
            insertBefore: '#lazyload_placeholder' 
           }) 
           .then(function() { 
            return $ocLazyLoad.load([ 
             'assets/js/directives/widget-1.js', 
             'assets/js/controllers/dashboard.js' 
            ]); 
           }); 
         }] 
        } 
       }) 

Mein Scope in DashboardCtrl:

$scope.labels = ["Download Sales", "In-Store Sales", "Mail-Order Sales"]; 
     $scope.data = [300, 500, 100]; 

Auf dieser Basis war ich die Donut Graph erwartet gemäß den Beispielen Seite für Winkeldiagramm gerendert werden: https://jtblin.github.io/angular-chart.js/ jedoch

nichts gemacht wird. Ich bin mir nicht sicher, was ich falsch mache.

Dank

Answer 1

Stellen Sie sicher, dass die richtigen Versionen und die CSS, um sie in der Art und Weise verwenden, soll es immer besser sein, kantig zu verwenden Version über 1,4

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script> 
<script src="chartjs/Chart.js"></script> 
<script src="chartjs/angular-chart.js"></script> 
<script src="js/index.js"></script> 

DEMO