如何JSON解析URL數據爲特定的AngularJS dxChart變量

Question

Content.JSON

[{ 
status: "Allocated", 
count: 45 
}, { 
status: "Bench", 
count: 89 
}, { 
status: "Mobile", 
count: 12 
}, { 
status: "Project", 
count: 1 
}, { 
status: "SAP", 
count: 18 
}, { 
status: "Testing", 
count: 68 
}, { 
status: "vvvv", 
count: 70 
}]; 

下面就是我試圖獲取JSON URL數據，但在控制檯中我得到以下錯誤

我AngularJS模塊

dxChart.js：9 E2001 - 無效的數據源。請參閱：http://js.devexpress.com/error/15_2/E2001

angular.module('myApp') 
.controller('valueController', ['$scope', '$http', '$window', function ($scope, $http, $window) {  

var mainInfo = null;  

    $http({ 
    method : "GET", 
    url : "/JSON/Content.json", 
    dataType: 'json', 
    }).then(function mySucces(response) {   

    mainInfo = response.data; 

    }, function myError(response) 
    { 
     $window.alert(response.statusText); 
    }); 

$scope.chartOptions = { 

      dataSource: mainInfo,  

      series: { 
       argumentField: "status", 
       valueField: "count", 
       name: "SIDG Java", 
       type: "bar", 
       color: '#1899dd' 
      } 
     }; 
}]); 

Answer 1

我認爲，

您所提供的輸入錯誤格式化的JSON數據。您可以從一些在線網站驗證它，如https://jsonformatter.curiousconcept.com/

請勿在JSON末尾使用分號。下面是正確的格式：

[{ 
"status": "Allocated", 
"count": 45 
}, { 
"status": "Bench", 
"count": 89 
}, { 
"status": "Mobile", 
"count": 12 
}, { 
"status": "Project", 
"count": 1 
}, { 
"status": "SAP", 
"count": 18 
}, { 
"status": "Testing", 
"count": 68 
}, { 
"status": "vvvv", 
"count": 70 
}] 

還利用try catch塊來處理異常解析

try { 
    mainInfo = JSON.parse(response); 
} catch (err) { 
    console.log(err); 
}