我有一个复杂的JSON对象,我必须循环它并在表单中呈现数据。为此我创建了一个这样的小服务:
service.myApprovalResults = function(){
var url = "../data/myapprovals.json";
return $http.post(url).success(function(response) {
$rootScope.names = response;
});
};
以下是我的JSON文件:
{
"result": [
{
"Approval": {
"Id":"111", // Unique Id
"Api":"api/sometihgn/111"
},
"Ticket":{
"Id":"TKT1000011",
"API":"api/ticket/TKT1000011"
},
"TicketItem":{
"Id":"RITM1000011",
"API":"api/ticket_item/RITM1000011"
},
"ProcessStep":"",
"Description":"Need Approval For sdsadas", // See Note Section
"VariablesSet":// See Note Section
[ // VariableSet details.
{
"Question":"Joining Date",
"Name": "joining_date",
"Id":"13",
"Value": ["12:12:2014"],
"DisplayValue":[""],
"Reference":""
},
{
"Question":"Reporting Manager",
"Name": "reporting_manager",
"Id":"14",
"Value": ["samd"],
"DisplayValue":["/Sam Doni"],
"Reference":"/api/user"
},
{
"Question":"Department",
"Name": "department",
"Id":"15",
"Value": ["IT Security"],
"DisplayValue":[""],
"Reference":""
},
{
"Question":"Accessories Needed?",
"Name": "accessories",
"Id":"16",
"Value": ["laptop","mouse"],
"DisplayValue":[""],
"Reference":""
}
],
"ApprovalFor": {
"Name": "Sam Doni",
"UserName": "samd",
"Email":"samd@test.com",
"Api": "api/user/samd" // Api can be used to get more details
},
"Approver":{ // Optional
"Name": "sdsdsdsad",
"UserName": "sdsdsad",
"Email":"sadsads@dssdf.com",
"Api": "api/user/dssds" // Api can be used to get more details
},
"State": "Requested",
"Group": "",// Optional
"CreatedBy": {
"Name": "sadsdsddsa",
"UserName": "sdsd",
"Email": "sdsad@test.com",
"Api": "api/user/sadsadsa"
},
"CreatedOn": "2016-11-09T17:29:01Z",
"UpdatedOn": "2016-11-09T17:29:01Z",
"CommentsSet": [{
"Id": "10",
"TicketItem": "RITM1001011",
"Type": "approvalnote",
"Value": "User has issues related to access",
"CreatedOn": "2016-11-09T17:29:01Z",
"CreatedBy": {
"Name": "sdsdsadsadd",
"UserName": "dsdsad",
"Email":"sdsad@test.com",
"Api": "api/user/ssddsad"
}
},
{
"Id": "11",
"TicketItem": "RITM1001011",
"Type": "approvalnote",
"Value": "Issue is solved",
"CreatedOn": "2016-11-08T17:29:01Z",
"CreatedBy": {
"Name": "dsadsdsad
"UserName": "sdsadas",
"Email":"dsads@test.com",
"Api": "api/user/sadsadsadsa"
}
}
]
},
{
"Approval": {
"Id":"112",
"Api":"api/approval/112"
},
"Ticket":{
"Id":"TKT1000013",
"API":"api/ticket/TKT1000013"
},
"TicketItem":{
"Id":"RITM1000021",
"API":"api/ticket_item/RITM1000021"
},
"ProcessStep":"",
"Description":"Add user to Helpnow Group",// See Note Section
"VariablesSet":// See Note Section
[
{
"Question":"Location Service Needed",
"Name": "location",
"Id":"16",
"Value": ["11"],
"Reference":"/api/location";
},
{
"Question":"What is the issue",
"Name": "service_needed",
"Id":"18",
"Value": ["aloha"]
"DisplayValue":[""],
"Reference":""
}
],
"ApprovalFor": {
"Name": "dsfdsfdsf",
"UserName": "dfdsf
"Email":"dfdsfds@gmail.com",
"Api": "api/user/rsds// Api can be used to get more details
},
"Approver":"",
"State": "Requested",
"Group": {
"Name": "FIN Group",
"Id":"10"
"Api": "api/group/10"// Unique Group ID in SAP
}
}
]
}
使用这个JSON我需要遍历并在表单中显示JSON数据。我在下面添加了以下代码:
<ul>
<li ng-repeat="x in names">
{{ x.result.Approval.Id }}, {{ x.result.Ticket.Id }}, {{x.result.TicketItem.Id}}, {{x.result.Description}}
</li>
</ul>
完成上述事情,但我无法在表格中看到数据。
我检查了chrome开发人员工具,JSON正在正确加载。 有人可以建议我吗?
答案 0 :(得分:0)
您错误地迭代了数据。我相信你想在你的阵列中显示细节。
您需要将x in names
更改为x in names.result
。然后,将表达式更改为直接使用x
,如下所示:
{{ x.Approval.Id }}, {{ x.Ticket.Id }}, {{x.TicketItem.Id}}, {{x.Description}}
答案 1 :(得分:0)
首先,在声明时检查是否已将$rootScope.names
指定为空数组。如果是这种情况,请尝试直接声明并尽可能在服务中分配(以避免数据结构进一步复杂化)。
根据您的JSON结构,您的代码应该是:
<ul>
<li ng-repeat="x in names.result">
{{ x.Approval.Id }}, {{ x.Ticket.Id }}, {{x.TicketItem.Id}}, {{x.Description}}
</li>
</ul>
此外,为了避免这种复杂程度,请尝试重新构建您下次的JSON和响应存储:)