我如何在angularjs中显示儿童嵌套注释
问题描述:
好的晚上家伙,请在Angular中的父亲注释下显示嵌套的子注释。我不知道如何实现嵌套注释的逻辑以显示在下面这是家长的意见。我尝试过,循环所有的意见,但它不起作用。我会很感激,如果你们看着我。我如何在angularjs中显示儿童嵌套注释
function loadData() {
$http({
url: '../Services/svBlogComments.asmx/GetAllBlogCommentByBlogID',
method: 'get',
params: { bid: $routeParams.ID }
}).then(function (response) {
$scope.y = response.data;
//console.log($scope.y[i].ID);
try {
for (var i = 0; i < response.data.length;i++)
{
$http({
url: '../Services/svBlogComments.asmx/GetAllBlogCommentByParentID',
method: 'get',
params: { bid: $routeParams.ID, parentid: response.data[i].ID }
}).then(function (childcomments) {
$scope.p = childcomments.data;
});
}
} catch (e) {
console.log(e);
}
});
};
<div class="row" id="divParent">
<ul class="media-list" ng-repeat="x in y">
<li class="media" data-id="{{x.ID}}">
<div class="media-left">
<a href="#">
<img id="ImageParent" class="media-object" style="width: 40px; height: 40px;" src="../backgrounds/conference.png" />
</a>
</div>
<div class="media-body">
<h4 class="media-heading" style="font-size: 12px; font-family: Rockwell;">{{x.Username}}
<small style="font-size: 13px;">
<i>{{x.Created | date:'dd, MMMM yyyy'}}</i>
</small>
<small style="font-size: 13px; visibility: hidden;">
<span id="lblID">{{x.ID}}</span>
</small>
</h4>
<p class="media-text" style="font-size: 14px; font-family: Rockwell;">
{{x.CommentMessage}}
</p>
<div class="" style="display:none;">
<a class="link reply-link" style="cursor: pointer; text-decoration: none; font-size: 12px;">Reply</a>
<a class="link cancel-link" style="cursor: pointer; text-decoration: none; font-size: 12px;">Cancel</a>
</div>
<div class="media" ng-repeat="a in p">
<div class="media-left">
<a href="#">
<img id="Img1" class="media-object" style="width: 40px; height: 40px;" src="../backgrounds/conference.png" />
</a>
</div>
<div class="media-body">
<h4 class="media-heading" style="font-size: 12px; font-family: Rockwell;">{{a.Username}}
<small style="font-size: 13px;">
<i>{{a.Created | date:'dd, MMMM yyyy'}}</i>
</small>
<small style="font-size: 13px; visibility: hidden;">
<span id="Span1">{{a.ID}}</span>
</small>
</h4>
<p class="media-text" style="font-size: 14px; font-family: Rockwell;">
{{a.CommentMessage}}
</p>
</div>
</div>
</div>
</li>
</ul>
</div>
答
你必须通过一个对象的深度使用“递归”循环,看看这篇文章:How can I make recursive templates in AngularJS when using nested objects?