2017-06-15 67 views
0

我試圖以表格格式打印數據。如何從此給定的JSON打印表格格式的數據

其存在下

我試圖作爲

<div ng-app="myapp" ng-controller="FirstCtrl"> 

      <table border="1"> 
     <tr> 
     <th ng-repeat="(key, val) in collectioninfo.records.properties">{{ key }}</th> 
     </tr> 
     <tr ng-repeat="row in collectioninfo"> 
     <td ng-repeat="column in row"> 
      {{ column }} 
     </td> 
     </tr> 
    </table> 
</div> 

JSON 「屬性」 (ApprovalStatusShrtStrngVal和FluidCodeShrtStrngVal)的數據是

{ 
    "records": [{ 
     "keys": ["n"], 
     "length": 1, 
     "_fields": [{ 
      "identity": { 
       "low": 1128, 
       "high": 0 
      }, 
      "labels": ["TestLabel"], 
      "properties": { 
       "ApprovalStatusShrtStrngVal": "Working", 
       "FluidCodeShrtStrngVal": "P" 
      } 
     }], 
     "_fieldLookup": { 
      "n": 0 
     } 
    }, { 
     "keys": ["n"], 
     "length": 1, 
     "_fields": [{ 
      "identity": { 
       "low": 1129, 
       "high": 0 
      }, 
      "labels": ["TestLabel"], 
      "properties": { 
       "ApprovalStatusShrtStrngVal": "Working", 
       "FluidCodeShrtStrngVal": "P" 
      } 
     }], 
     "_fieldLookup": { 
      "n": 0 
     } 
    }], 
    "summary": { 
     "statement": { 
      "text": "MATCH (n:TestLabel) RETURN n LIMIT 25", 
      "parameters": {} 
     }, 
     "statementType": "r", 
     "counters": { 
      "_stats": { 
       "constraintsRemoved": 0 
      } 
     }, 
     "updateStatistics": { 
      "_stats": { 
       "constraintsRemoved": 0 
      } 
     }, 
     "plan": false, 
     "profile": false, 
     "notifications": [], 
     "server": { 
      "address": "localhost:7687", 
      "version": "Neo4j/3.2.0" 
     }, 
     "resultConsumedAfter": { 
      "low": 37, 
      "high": 0 
     }, 
     "resultAvailableAfter": { 
      "low": 3, 
      "high": 0 
     } 
    } 
} 

http://jsfiddle.net/9fR23/498/

請讓我知道如何解決這個

ApprovalStatusShrtStrngVal FluidCodeShrtStrngVal(頭)
工作P(值)

+0

什麼是要在其中插入表格的格式?你能更具體地表明你想在表格中展示什麼樣的價值嗎? – Vivz

+0

如此小提琴中所示的簡單表格http://jsfiddle.net/9fR23/443/ – Pawan

+1

但是對於您的數據,您希望作爲表格標題和td元素中的值呈現什麼? – Vivz

回答

1

你通過你的陣列必須正確循環,以獲得期望的結果。

<table border="1"> 
    <tr> 
    <th ng-repeat="(key, val) in collectioninfo.records[0]._fields[0].properties">{{ key }}</th> 
    </tr> 
    <tr ng-repeat="row in collectioninfo.records"> 
    <td ng-repeat="column in row._fields[0].properties"> 
     {{ column }} 
    </td> 
    </tr> 
</table> 

工作小提琴http://jsfiddle.net/9fR23/499/

+0

非常感謝,正是需要 – Pawan

+0

歡迎您:) – Vivz