我正在尝试弄清楚如何显示与上一次 ng-click 中的数据相关的嵌套 json 数据。
任何见解将不胜感激，谢谢!
骗子:http://plnkr.co/edit/C7MlbHDawSdASHl1aLBB?p=preview
HTML
<ul class="list-unstyled">
<li ng-repeat="content in contentSets" ng-click="setContent(content)">
<a href="#">{{content.name}}</a>
</li>
</ul>
<h1>{{useContent.contentTitle}}</h1>
<ul class="list-unstyled">
<li ng-repeat="headline in useContent.headlines">
{{headline.title}}
</li>
</ul>
JSON
{
"contentData": [
{
"contentId": 1,
"name": "Content set 1",
"contentTitle": "Pretaining to content set 1",
"news": [
{
"headlineSet": 1,
"headlines": [
{
"title": "headline 1 (set 1)",
"date": "date for headline 1 (set 1)"
},
{
"title": "headline 2 (set 1)",
"date": "date for headline 2 (set 1)"
},
{
"title": "headline 3 (set 1)",
"date": "date for headline 3 (set 1)"
}
]
}
]
},
{
"contentId": 2,
"name": "Content set 2",
"contentTitle": "Pretaining to content set 2",
"news": [
{
"headlineSet": 1,
"headlines": [
{
"title": "headline 1 (set 2)",
"date": "date for headline 1 (set 2)"
},
{
"title": "headline 2 (set 2)",
"date": "date for headline 2 (set 2)"
},
{
"title": "headline 3 (set 2)",
"date": "date for headline 3 (set 2)"
}
]
}
]
},
{
"contentId": 3,
"name": "Content set 3",
"contentTitle": "Pretaining to content set 3",
"news": [
{
"headlineSet": 1,
"headlines": [
{
"title": "headline 1 (set 3)",
"date": "date for headline 1 (set 3)"
},
{
"title": "headline 2 (set 3)",
"date": "date for headline 2 (set 3)"
},
{
"title": "headline 3 (set 3)",
"date": "date for headline 3 (set 3)"
}
]
}
]
}
]
}
JS
function AppController($scope, $http) {
$http.get('content.json').success(function(data) {
$scope.contentSets = data.contentData;
$scope.news = [];
$scope.headlines = [];
angular.forEach(data.contentData, function(demoContent, index){
angular.forEach(demoContent.news, function(newsGroup, index){
$scope.news.push(newsGroup);
angular.forEach(newsGroup.headlines, function(headline, index){
$scope.headlines.push(headline);
});
});
});
});
$scope.setContent = function(content) {
$scope.useContent = content;
}
}
最佳答案
您可以直接在 View 中执行此操作:
<ul class="list-unstyled" ng-repeat="news in useContent.news">
<li ng-repeat="headline in news.headlines">
{{headline.title}}
</li>
</ul>
关于json - 如何在 ng-click 的上下文中显示嵌套 JSON 的数据(Angular、JSON)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/24272594/