使用Angular将JSon文件解析/绑定到表中 [英] Parsing/binding JSon file into Table using Angular
问题描述
如何在Json下绑定Place And Activity？我使用表解析Event和AccountShop并运行。我认为这是因为Place和Activiy的分隔符？任何人都可以在这里提供帮助或提出建议或建议将我带出代码。
How can I bind Place And Activity under Json? I do parse Event and AccountShop using table and it runs. I think its because of the delimiter in Place and Activiy? Can anyone help or has a suggestion here or advice to take me out of the code.
table.htm
table.htm
<!DOCTYPE html>
<html ng-app="myTable">
<head>
<title></title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-rc.0/angular.min.js"></script>
<script type="text/javascript">
var myTable=angular.module('myTable',[]);
myTable.controller('tableCtrl',function($scope,$http){
$http.get("Table.json").success(function(response){
$scope.members=response.events;
});
});
</script>
<style type="text/css">
table, th, td{
border: 2px sol grey;
border-collapse: collapse;
padding: 4px;
font-family: arial;
}
table tr:nth-child(odd){
background-color: #00BFFF;
}
table tr:nth-child(even){
background-color: #808080;
}
</style>
</head>
<body ng-controller="tableCtrl">
<table border="1">
<tr>
<th>Event</th>
<th>Account Shop</th>
<th>Place</th>
<th>Activity</th>
</tr>
<tr ng-repeat="member in members">
<td>{{member.Event.id}}<br>
{{member.Event.account_id}}<br>
{{member.Event.shop_id}}<br>
<td ng-repeat="member in members">
{{member.AccountShop.id}}<br>
{{member.AccountShop.name}}<br>
{{member.AccountShop.short_code}}<br>
</td>
<tr ng-repeat="member in members">
{{member.Place.id}}
{{member.Place.name}}
{{member.Place.lk_country_code}}
</table>
</body>
</html>
Table.json
Table.json
{
"events": [
{
"Event": {
"id": "59",
"account_id": "12",
"shop_id": "12",
},
"AccountShop": {
"id": "1",
"name": "Sample",
"short_code": "SampleL"
},
"Places": [
{
"id": "537",
"name": "Sample",
"lk_country_code": "MY"
}
],
"Activities": [
{
"id": "4011",
"short_description": "Sample\r\n"
},
{
"id": "106",
"short_description": "Sample\r\n \r\n"
},
{
"id": "1027",
"short_description": "Sample\r\n"
}
]
}
]
}
推荐答案
<tr ng-repeat="member in members">
<td>{{member.Event.id}}</td>
<td>{{member.Event.account_id}}
<td>{{member.Event.ishop_id}}
</td><td>{{member.AccountShop.id}}
</td> </tr>
您不需要遍历Event，Account，Place，因为它们是单个实体。而不是这个迭代成员。所以你可以获得Event和它自己的属性，AccountShop及其属性等......
You don't need to iterate through Event, Account, Place , because they are single entities. Instead of this iterate over members. So you can get Event and it's own properties, AccountShop and it's properties and etc...
这篇关于使用Angular将JSon文件解析/绑定到表中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
