如何以角度拆分JSON数组中的两个项目答案

【问题标题】：How to split two items inside a JSON array in angular如何以角度拆分JSON数组中的两个项目
【发布时间】：2017-02-04 07:06:01
【问题描述】：

这是我的代码：

$scope.center_name = [];
      $scope.stats = ["Stats"];
      $scope.totMemCenterData = [];


      var query = "SELECT count(*) as tot_mem, centers.name as center_name FROM mem_groups "
    + "INNER JOIN centers ON mem_groups.center_id=centers.id GROUP BY centers.id";
      $cordovaSQLite.execute(db, query, [])
      .then(function(res){
          if (res.rows.length > 0) {
          for (var i=0; i < res.rows.length; i++) {
            $scope.totMemCenterData = res.rows.item(i);
            console.log(JSON.stringify($scope.totMemCenterData));

          }
        }
      }, function(err){
          // $cordovaToast.showShortBottom('Something Went Wrong').then(function(success){}, function(err){});
          console.log(err.message);
      });

这是console.log(JSON.stringify($scope.totMemCenterData)); 的结果：

{"center_name":"AFG - ANONANG","tot_mem":6}
{"center_name":"BAM - BUENAVISTA","tot_mem":3}
{"center_name":"GHT - TAGAS","tot_mem":2}

我想将所有 center_names 放在一个数组中，同时将 tot_mem 放在另一个数组中。我希望它是这样的：

中心：“AFG - ANONANG”、“BAM - 布埃纳维斯塔”、“GHT - TAGAS” Tot_mem: 6, 3, 2 我要把这些值放在图表上。以 x 轴为中心，以 y 轴为中心

【问题讨论】：

我会试试这个。谢谢！ @Sajeetharan
如果有帮助则标记为答案

标签： javascript angularjs arrays json split

【解决方案1】：

你可以这样做，

  $scope.center_names = [];
  $scope.tot_mem = [];
  angular.forEach($scope.sampleTest, function(key, value) {
  $scope.center_names.push(key["center_name"]);
  $scope.tot_mem.push(key["tot_mem"]);
  });

演示

var app = angular.module('sampleApp', []);
app.controller('myCtrl', function($scope) {
  $scope.sampleTest = [{
    "center_name": "AFG - ANONANG",
    "tot_mem": 6
  }, {
    "center_name": "BAM - BUENAVISTA",
    "tot_mem": 3
  }, {
    "center_name": "GHT - TAGAS",
    "tot_mem": 2
  }];
  $scope.center_names = [];
  $scope.tot_mem = [];
  angular.forEach($scope.sampleTest, function(key, value) {
      $scope.center_names.push(key["center_name"]);
      $scope.tot_mem.push(key["tot_mem"]);
  });
});

<!DOCTYPE html>
<html ng-app="sampleApp" xmlns="http://www.w3.org/1999/xhtml">
<head>
  <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.10/angular.min.js"></script>
 </head>
<body ng-controller="myCtrl">
  <h1> Center names </h1>
    <div ng-repeat="item in center_names">
      {{item}}
      </div>
   <h1> Total memory </h1>
   <div ng-repeat="tot in tot_mem">
      {{tot}}
      </div>
</body>
</html>

【讨论】：

【解决方案2】：

一些观察：

TypeError: res.rows.item 不是函数

所以，请使用 res.rows.item[i] 而不是 res.rows.item(i).
为什么是JSON.stringify ？因为您必须迭代每个对象以根据键创建两个不同的数组。所以，保持 $scope.totMemCenterData 不变。
当您要迭代项目时，不要检查 res.rows.length 的长度，而是检查项目的长度 (res.rows.item.length)。

工作演示：

var myApp = angular.module('myApp',[]);

myApp.controller('MyCtrl',function($scope) {
    var res = {
	"rows": {
		"item": [{
			"center_name": "AFG - ANONANG",
			"tot_mem": 6
		}, {
			"center_name": "BAM - BUENAVISTA",
			"tot_mem": 3
		}, {
			"center_name": "GHT - TAGAS",
			"tot_mem": 2
		}]
	}
};

$scope.center_names = [];
$scope.tot_mem = [];
   
for (var i=0; i < res.rows.item.length; i++) {
    $scope.totMemCenterData = res.rows.item[i];
    $scope.center_names.push($scope.totMemCenterData.center_name);
    $scope.tot_mem.push($scope.totMemCenterData.tot_mem);
}

});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="MyCtrl">
<b>Center Names :</b>
<div ng-repeat="names in center_names">
{{names}}
</div>
<b>Total Mem :</b>
<div ng-repeat="item in tot_mem">
{{item}}
</div>
</div>

【讨论】：