2016-06-29 12 views
0

Ich habe ein Problem innerhalb meiner AngularJS-Anwendung, bei dem das Kreisdiagramm nicht vom Winkeldiagramm dargestellt wird, das Chart.JS verwendet.Kreisdiagramm nicht angezeigt Kreisdiagramm

Ich habe chart.js als Abhängigkeit in meinem Winkelmodul registriert, wie folgend:

var app = angular.module("uniSurvey", 
         ["common.services", 
          "ui.router", 
          "chart.js"]); 

Dann in meiner Sicht, ich habe die Kreisdiagramm Leinwand nach ihrer Dokumentation hinzugefügt:

<div ng-repeat="item in resultsDetails.items"> 
     <canvas id="pie" class="chart chart-pie chart-xs" 
       chart-data="resultsDetails.data" 
       chart-labels="resultsDetails.label" 
       chart-legend="resultsDetails.legend"></canvas> 
</div> 

und in meinem Controller für diese Ansicht habe ich den Datensatz von der Tabelle erforderlich, wie folgend:

(function() { 
"use strict"; 
angular 
    .module("uniSurvey") 
    .controller("ResultsDetailsController", ["$stateParams", "resultResource", ResultsDetailsController]); 

function ResultsDetailsController($stateParams, resultResource) { 
    var resultsDetails = this; 
    resultsDetails.currentSurveyId = $stateParams.id; 

    resultsDetails.labels = ["Download Sales", "In-Store Sales", "Mail-Order Sales"]; 
    resultsDetails.data = [300, 500, 100]; 
    resultsDetails.legend = true; 

    resultsDetails.items = []; 
} 

}());

Mit dem aktuellen Setup, erhalte ich folgende Fehlermeldung:

angular.js:13550 TypeError: Cannot read property 'map' of undefined at v (angular-chart.min.js:323) at d (angular-chart.min.js:191) at angular-chart.min.js:150 at n.$digest (angular.js:17073) at n.$apply (angular.js:17337) at l (angular.js:11572) at H (angular.js:11778) at XMLHttpRequest.u.onload (angular.js:11711)

Irgendwelche Ideen, welche Schritte ich bitte verpasst haben?

+1

Haben Sie die Abhängigkeit 'angular-chart.min.js' von Ihrer Seite eingeschlossen? – Maverick976

+0

@ Maverick976 - Ja, das hatte ich getan, inklusive meinem dummen Fehler als Antwort. –

Antwort

0

Es stellte sich heraus, es war ein dummer Fehler, es war "ErgebnisseDetails.Labels" nicht "resultsDetails.Label". Da es das erste Mal ist, dass ich ein eckiges Diagramm verwende, dachte ich, dass dies etwas anderes ist, nicht das grundlegendste.