Question

我正在使用AngularJS来渲染执行ajax调用的html页面，该调用返回json文件。

如何使用angularjs在JSON下面获取id的数量？

[{"id":1,"Name":"Apple"},
 {"id":2,"Name":"Mango"},
 {"id":3,"Name":"Banana"}
 {"id":4,"Name":"Coconut"}
 {"id":5,"Name":"pineaple"}
 {"id":6,"Name":"Orange"}
 {"id":7,"Name":"Guava"}]

Answer 1

你不需要Angular来获得它的长度。

在这种情况下，您解析的JSON是一个简单的数组，您可以通过以下方式获得长度：

obj.length

假设obj包含您解析的JSON：

var obj = [{"id":1,"Name":"Apple"},
{"id":2,"Name":"Mango"},
{"id":3,"Name":"Banana"}
{"id":4,"Name":"Coconut"}
{"id":5,"Name":"pineaple"}
{"id":6,"Name":"Orange"}
{"id":7,"Name":"Guava"}]

Answer 2

var json=
[{"id":1,"Name":"Apple"},
{"id":2,"Name":"Samsung"},
{"id":3,"Name":"Nokia"}
{"id":4,"Name":"Motorola"}]

  var count = Object.keys(json).length;
  console.log(count);

Answer 3

在您的HTML中，假设您的数组是＆＃34;评论＆＃34; （一个常见的用例）：

{{ comments.length }}

你也可以在一个元素上做ng-hide="{{ comments.length}}"，该元素说明了＃34;没有评论＆＃34;。

Answer 4

如果使用数组中的某个键计算对象，那么一切都很好。如果您使用其他键更改JSON数组会发生什么？我提出的解决方案是针对通用JSON阵列。例如，我使用$ resource来获取数据： $ resource（pathToJSON）.query（） - ＆gt;它返回ResourceClass，而不是JSON数组

之后你需要做下一步：

$scope.resourceClass = $resource(pathToJSON).query();

$ scope.resourceClass。$ promise - ＆gt;返回promise对象

$scope.resourceClass.$promise.then(function(data) {
      console.log(data.length);
});

数据是JSON数组。

Answer 5

检查https://jsfiddle.net/arunsoraba/qfurytmn/6/示例。

all

Answer 6

Json Data:

            { "docNme": "HSL_Invoice_SRG Network_2", "isMultiPage": true, "pgLst": [ { "pgH": "792.0", "pgW": "612.0", "pgNo": "1", "prmLst": [ { "isReference": "false", "ocrKey": "officeAddress", "keyNm": "Office Address", "keyLoc": "34,106,68,9", "keyFont": "", "keyClr": "", "valNm": "", "valLoc": "34,117,176,113", "valFont": "", "valClr": "" }, { "isReference": "false", "ocrKey": "godownAddress", "keyNm": "Godown Address", "keyLoc": "216,106,77,9", "keyFont": "", "keyClr": "", "valNm": "", "valLoc": "216,117,176,113", "valFont": "", "valClr": "" }, { "isReference": "false", "ocrKey": "GSTIN", "keyNm": "GSTIN", "keyLoc": "382,106,30,9", "keyFont": "", "keyClr": "", "valNm": "27AAACH1925Q1ZK", "valLoc": "420,106,94,9", "valFont": "", "valClr": "" }, { "isReference": "false", "ocrKey": "invoiceNo", "keyNm": "Invoice No.", "keyLoc": "382,129,55,9", "keyFont": "", "keyClr": "", "valNm": "56789", "valLoc": "444,129,32,9", "valFont": "", "valClr": "" }, { "isReference": "false", "ocrKey": "poNo", "keyNm": "PO No.", "keyLoc": "382,223,36,9", "keyFont": "", "keyClr": "", "valNm": "HSL-IT-0038-2017/2018", "valLoc": "424,223,118,9", "valFont": "", "valClr": "" } ] }, { "pgH":"792.0", "pgW":"612.0", "pgNo":"2", "prmLst":[ { "isReference": "false", "ocrKey": "officeAddress", "keyNm": "Office Address", "keyLoc": "34,106,68,9", "keyFont": "", "keyClr": "", "valNm": "", "valLoc": "34,117,176,113", "valFont": "", "valClr": "" }, { "isReference": "false", "ocrKey": "godownAddress", "keyNm": "Godown Address", "keyLoc": "216,106,77,9", "keyFont": "", "keyClr": "", "valNm": "", "valLoc": "216,117,176,113", "valFont": "", "valClr": "" }, { "isReference": "false", "ocrKey": "GSTIN", "keyNm": "GSTIN", "keyLoc": "382,106,30,9", "keyFont": "", "keyClr": "", "valNm": "27AAACH1925Q1ZK", "valLoc": "420,106,94,9", "valFont": "", "valClr": "" }, { "isReference": "false", "ocrKey": "invoiceNo", "keyNm": "Invoice No.", "keyLoc": "382,129,55,9", "keyFont": "", "keyClr": "", "valNm": "56789", "valLoc": "444,129,32,9", "valFont": "", "valClr": "" }, { "isReference": "false", "ocrKey": "poNo", "keyNm": "PO No.", "keyLoc": "382,223,36,9", "keyFont": "", "keyClr": "", "valNm": "HSL-IT-0038-2017/2018", "valLoc": "424,223,118,9", "valFont": "", "valClr": "" }] } ] }


Fetch Size :

    let pageLstSize=this.data.pgLst;
        console.log(pageLstSize);

Output : 2

Answer 7

如果obj.length不起作用，请确保您在相应的控制器内调用它。

获取AngularJS中JSON数组的大小

7 个答案: