Question

代码：http://plnkr.co/edit/0eHQPVRHmCWelK6VEYVE?p=preview

这是来自JSON文件的分析图表：http://happyshappy.13llama.com/wp-json/llama/v1/stats

我想在图表顶部放置一个下拉菜单，在下拉列表中，JSON的“label”元素应该可以通过GET看到。用户选择标签后，其数据在图表中可见。

请尽快帮助我！

app.controller('MainCtrl', function($scope, $http) {
$http.get('http://happyshappy.13llama.com/wp-json/llama/v1/stats').then(function(response) {
var visitDates = response.data.visits.labels.map(function(dateString) {
  return new Date(dateString);
});

$scope.visits = response.data.visits.datasets;
var dateData = [];
var countData = [], index = 0 , i;
angular.forEach($scope.visits, function(dataSet) {
  dataSet.data = dataSet.data.map(function(count, i) {
    index++;
    dateData[i] = visitDates[i];
    countData[i] = count;
    return {
      date: visitDates[i],
      count: count,
      dateData: dateData,
      countData: countData
    };
  });
});

Answer 1

我根本不确定你想做什么，但我想你想要一个带标签的选择，如果你点击一个标签，那么图表会显示标签的值，对吗？

<select ng-options="item as item.label for item in visits" ng-click="changeValues()" ng-model="selected"></select>

然后在您的控制器中创建该功能

$scope.changeValues() {
    // You have the selected label in $scope.selected, so you have to iterate
    // over the visits array and then set the data where label == $scope.selected in the chart values
}

我现在无法对其进行测试，但我希望这个想法可以帮助您解决问题。

如何在Angular JS中添加Dyamic JSON下拉菜单

1 个答案: