【问题标题】:Iterate a JSON object迭代一个 JSON 对象
【发布时间】:2016-11-02 16:08:10
【问题描述】:

我想遍历一个 json 对象 transactionByFop

HTML

<div ng-show="searhController.orderCAT.results.length" ng-repeat="(key,obj) in searhController.orderCAT.results track by $index">
            <dl style="border: 1px;"  ng-repeat="(keySub, resp) in obj">
                <dt>{{keySub}}</dt>
                <dd>{{resp}}</dd>
            </dl>
            </div>

JSON

[{
"lastUpdate": "2015-04-06 12:19:20.902",
"orderId": "83642465",
"idFop": 1,
"transactionByFop": {
    "idTransactionByFop": 1523280,
    "Binnacle": {
        "tbkIdTransaction": 8333514670,
        "ackType": "ACK",
        "tbkOrderBuy": 1523280,
        "tbkCodeCommerce": 123123,
        "tbkTypeTransaction": "TR_NORMAL",
        "tbkResponse": -1,
        "tbkAmount": 3.7298E7,
        "tbkCodeAuthorization": 0,
        "tbkFinalNumberCard": "213123",
        "tbkAccountantDate": "0406",
        "tbkTransactionDate": "0406",
        "tbkTransactionHour": "121830",
        "tbkIdSession": 1523280,
        "tbkTypePayment": "VN",
        "tbkNumberFee": 0
    }
},
"isLast": true}]

【问题讨论】:

    标签: javascript html angularjs arrays json


    【解决方案1】:

    您想要展平嵌套对象。这是您可以做的事情(基于this thread 的回答)。

    创建一个可以展平对象的函数

    $scope.flattenResults = function(data) {
      var result = {};
    
      function recurse(cur, prop) {
        if (Object(cur) !== cur) {
          result[prop] = cur;
        } else if (Array.isArray(cur)) {
          for (var i = 0, l = cur.length; i < l; i++)
            recurse(cur[i], prop + "[" + i + "]");
          if (l == 0)
            result[prop] = [];
        } else {
          var isEmpty = true;
          for (var p in cur) {
            isEmpty = false;
            recurse(cur[p], prop ? prop + "." + p : p);
          }
          if (isEmpty && prop)
            result[prop] = {};
        }
      }
      recurse(data, "");
      return result;
    };
    

    在你的 ng-repeat 中使用它

    <dl style="border: 1px;" ng-repeat="(keySub, resp) in flattenResults(obj)">
    

    请参阅下面的工作示例 -

    var searchapp = angular.module('searchapp', [])
      .controller('searchController', function($scope) {
        $scope.results = [{
          "lastUpdate": "2015-04-06 12:19:20.902",
          "orderId": "83642465",
          "idFop": 1,
          "transactionByFop": {
            "idTransactionByFop": 1523280,
            "Binnacle": {
              "tbkIdTransaction": 8333514670,
              "ackType": "ACK",
              "tbkOrderBuy": 1523280,
              "tbkCodeCommerce": 123123,
              "tbkTypeTransaction": "TR_NORMAL",
              "tbkResponse": -1,
              "tbkAmount": 3.7298E7,
              "tbkCodeAuthorization": 0,
              "tbkFinalNumberCard": "213123",
              "tbkAccountantDate": "0406",
              "tbkTransactionDate": "0406",
              "tbkTransactionHour": "121830",
              "tbkIdSession": 1523280,
              "tbkTypePayment": "VN",
              "tbkNumberFee": 0
            }
          },
          "isLast": true
        }];
    
        $scope.flattenResults = function(data) {
          var result = {};
    
          function recurse(cur, prop) {
            if (Object(cur) !== cur) {
              result[prop] = cur;
            } else if (Array.isArray(cur)) {
              for (var i = 0, l = cur.length; i < l; i++)
                recurse(cur[i], prop + "[" + i + "]");
              if (l == 0)
                result[prop] = [];
            } else {
              var isEmpty = true;
              for (var p in cur) {
                isEmpty = false;
                recurse(cur[p], prop ? prop + "." + p : p);
              }
              if (isEmpty && prop)
                result[prop] = {};
            }
          }
          recurse(data, "");
          return result;
        };
      });
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
    <div ng-app="searchapp" ng-controller="searchController">
      <div ng-show="results.length" ng-repeat="(key,obj) in results track by $index">
        <dl style="border: 1px;" ng-repeat="(keySub, resp) in flattenResults(obj)">
          <dt>{{keySub}}</dt>
          <dd>{{resp}}</dd>
        </dl>
      </div>
    </div>

    【讨论】:

    • 估计谢谢,我会实施你评论
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-10-25
    • 2018-06-30
    • 1970-01-01
    • 2017-07-26
    • 2017-05-21
    • 2011-06-05
    相关资源
    最近更新 更多