Reading Json in angularjs


{
"days": [
{
"day": "2018-11-25T00:00:00",
"entries": [
{
"name": "D",
"value": 1,
"parts": [
"EG"
]
},
{
"name": "S",
"value": 0,
"parts": []
},
{
"name": "J",
"value": 2,
"parts": []
},
{
"name": "S",
"value": 1,
"parts": [
"Lead"
]
},
{
"name": "W",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "Jen C",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "T",
"value": 2,
"parts": []
},
{
"name": "B",
"value": 2,
"parts": []
},
{
"name": "B",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "R",
"value": 0,
"parts": []
},
{
"name": "B",
"value": 1,
"parts": [
"AG"
]
},
{
"name": "S",
"value": 0,
"parts": []
},
{
"name": "N",
"value": 2,
"parts": []
},
{
"name": "J",
"value": 2,
"parts": []
},
{
"name": "S",
"value": 1,
"parts": [
"2nd"
]
}
]
}

你好,

我得到了Json这样的风格。这就是我用来显示json对象的内容。

<table class="table">
<thead>
<tr>
<th ng-repeat=" x in schedule" scope="col">{x.day}</th>
</tr>
</thead>
<tbody>
<tr>
<th ng-repeat=" x in schedule" scope="row">{x.name}</th>
<td>{x.parts}</td>
</tr>
</tbody>
</table>

但这似乎不起作用。它给了我错误,并且根本不绑定表中的任何数据。我甚至试着看"观察窗口",但我不知道如何显示表格中的所有内容。任何帮助都将不胜感激。我穿着angularjs做这件事。谢谢

尝试下面的代码片段。

var myApp = angular.module('myApp',[]);
function MyCtrl($scope) {
$scope.schedule = {
"days": [
{
"day": "2018-11-25T00:00:00",
"entries": [
{
"name": "D",
"value": 1,
"parts": [
"EG"
]
},
{
"name": "S",
"value": 0,
"parts": []
},
{
"name": "J",
"value": 2,
"parts": []
},
{
"name": "S",
"value": 1,
"parts": [
"Lead"
]
},
{
"name": "W",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "Jen C",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "T",
"value": 2,
"parts": []
},
{
"name": "B",
"value": 2,
"parts": []
},
{
"name": "B",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "R",
"value": 0,
"parts": []
},
{
"name": "B",
"value": 1,
"parts": [
"AG"
]
},
{
"name": "S",
"value": 0,
"parts": []
},
{
"name": "N",
"value": 2,
"parts": []
},
{
"name": "J",
"value": 2,
"parts": []
},
{
"name": "S",
"value": 1,
"parts": [
"2nd"
]
}
]
}
]
};
}
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
</head>
<body>
<div ng-app="myApp" ng-controller="MyCtrl">
<table class="table" border=1>
<thead>
<tr>
<th ng-repeat=" x in schedule.days" scope="col">{{x.day}}</th>
</tr>
</thead>
<tbody>
<tr ng-repeat=" item in schedule.days[0].entries" scope="row">
<td>{{item.name}}</td>
<td ng-repeat=" itm in item.parts">{{itm}}</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>

错误在于绑定。您需要使用双卷标记绑定,如{{x.day}}、{{s x.name}等。有关详细信息,请参阅此链接。

最新更新