处理表中数组 JSON 内的数组答案

【问题标题】：Handling array inside array JSON in table处理表中数组 JSON 内的数组
【发布时间】：2016-12-26 14:11:38
【问题描述】：

我有一个如下 JSON 响应：

var res =   
     {
      "response": {
        "data": {
          "profilesearchsnippet": [
            [
              {
                "profileInfo": {
                  "firstname": "Sundar",
                  "lastname": "v",
                  "gender": "male",
                  "country": "Afghanistan",
                  "state": "Badakhshan",
                  "city": "Eshkashem",
                  "pincode": "",
                  "plancode": "T001",
                  "userid": 13
                },
                "roleInfo": {
                  "defaultphotoid": 94
                }
              }
            ],
            [
              {
                "profileInfo": {
                  "firstname": "ghg",
                  "lastname": "vbhvh",
                  "gender": "male",
                  "state": "Badakhshan",
                  "city": "Eshkashem",
                  "pincode": "454",
                  "plancode": "T001",
                  "userid": 22
                },
                "roleInfo": {
                  "defaultphotoid": 171
                }
              }
            ]
          ]
        }
      }
    }

我想获取表中的所有名字，国家/地区城市。我尝试将 profilesearchsn-p 值分配给变量 var SearchData 并尝试使用 profileinfo 获取名字，因为它的对象。我在某处遗漏了一些需要帮助的东西。

HTML：

 <tr ng-repeat= "item in searchData">
        <td>{{item.profileInfo.firstname}}</td>
        <td> {{item.profileInfo.country}}</td>
      </tr>

JS：

var searchData = res.response.data.profilesearchsnippet[0];

【问题讨论】：

您是否已将 searchData 分配给控制器或范围之类的东西？
searchData 不是您要查找的可迭代对象，您将其定义为 var searchData = res.response.data.profilesearchsnippet[0]; 这只是搜索结果之一。尝试不使用[0]。
embed.plnkr.co/XQismiIYFLTDy2y7sdQg

标签： angularjs json

【解决方案1】：

在Js中是这样的：-

var searchData = res.response.data.profilesearchsnippet[0];;

在 HTML 中：-

 <div ng-repeat= "item in searchData">
 <tr ng-repeat= "itm in item">
        <td>{{itm.profileInfo.firstname}}</td>
        <td> {{itm.profileInfo.country}}</td>
      </tr>
 <div>

【讨论】：

【解决方案2】：

<tr ng-repeat= "item in searchData">
    <td>{{item[0].profileInfo.firstname}}</td>
    <td> {{item[0].profileInfo.country}}</td>
  </tr>

您要访问的数据位于另一个具有单个值的数组中，因此请使用索引访问它。

【讨论】：

【解决方案3】：

你只会得到一个使用：

var searchData = res.response.data.profilesearchsnippet[0];

试试这个：

var searchData = res.response.data.profilesearchsnippet;

在template:

<tr ng-repeat= "item in searchData">
    <td>{{item[0].profileInfo.firstname}}</td>
    <td> {{item[0].profileInfo.country}}</td>
  </tr>

更新：

item[0].profileInfo

希望这会奏效。

【讨论】：

【解决方案4】：

希望这是您的要求，并且您有国家温室气体的字段，所以它不会显示在输出中，而是我添加了一个静态消息

<!DOCTYPE html>
<html ng-app="plunker">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css" />
    <script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.12/angular.js" data-semver="1.4.9"></script>
    <script src="app.js"></script>
  </head>

  <body ng-controller="MainCtrl">
    <div ng-repeat= "item in searchData">
        <p>{{item[0].profileInfo.firstname}}</p>
         <p>{{item[0].profileInfo.country ||"no country data available "}}</p>
        
      </div>
  </body>
<script>
  var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  $scope.name = {
  "response": {
    "data": {
      "profilesearchsnippet": [
        [
          {
            "profileInfo": {
              "firstname": "Sundar",
              "lastname": "v",
              "gender": "male",
              "country": "Afghanistan",
              "state": "Badakhshan",
              "city": "Eshkashem",
              "pincode": "",
              "plancode": "T001",
              "userid": 13
            },
            "roleInfo": {
              "defaultphotoid": 94
            }
          }
        ],
        [
          {
            "profileInfo": {
              "firstname": "ghg",
              "lastname": "vbhvh",
              "gender": "male",
              "state": "Badakhshan",
              "city": "Eshkashem",
              "pincode": "454",
              "plancode": "T001",
              "userid": 22
            },
            "roleInfo": {
              "defaultphotoid": 171
            }
          }
        ]
      ]
    }
  }
};
$scope.searchData = $scope.name.response.data.profilesearchsnippet;

});

</script>
</html>

【讨论】：