- 首页
- 其他开发
- angular 5 显示嵌套问题和答案在其父项下显示项
angular 5 显示嵌套问题和答案在其父项下显示项
[英] angular 5 display nested questions and answer show item under it parent item
本文介绍了angular 5 显示嵌套问题和答案在其父项下显示项的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
这是我对问题和答案的服务器响应......它是一个数组.
<预><代码>[{身份证":1，产品":1，用户":亚历克斯"，"text": "可以吗?",parent_id":空，},{身份证":2，产品":1，"user": "john doe","text": "是的，没关系.",发布":真的，parent_id":1，},{身份证":3，产品":1，用户":湿婆"，"text": "我怎么能......",发布":真的，parent_id":空，},]
第二项( id 2 )是对问题 1 的回答，因为它的 partent_id = 1 而 id 3 是独立问题
我想在嵌套的有序列表中显示自己的问题下的每个响应如果问题有任何回应..我该怎么做?
我做了这样的事情，但它认为这是完全错误的，谁能指导我正确地做到这一点?谢谢
用于获取问题和答案的组件
this._store.viewSingleProductQA(this.product.product_id).subscribe(data => {this.questions = 数据；this.responses = this.questions.filter(d => d.parent_id == this.questions.id)});
html:
<div>{{question?.user}}</div><div>{{question.text}}</div>
<div *ngFor="让响应的资源">{{res.text}}
解决方案
试试这个HTML，这里的回复如下
响应 = [{身份证":1，产品":1，用户":亚历克斯"，"text": "可以吗?",parent_id":空，},{身份证":2，产品":1，"user": "john doe","text": "是的，没关系.",发布":真的，parent_id":1，},{身份证":3，产品":1，用户":湿婆"，"text": "我怎么能......",发布":真的，parent_id":空，},]<div *ngFor="让响应的资源"><div *ngIf="res.parent_id === null">问题:{{res.text}}<br/>答案:<ng-container *ngFor="let res2 of response"><div *ngIf="res2.parent_id === res.id">{{res2.text}}
</ng-容器>
检查这个fiddle
this is my server response for quetions and answers.. its a array.
[
{
"id": 1,
"product": 1,
"user": "alex",
"text": "is it ok?",
"parent_id": null,
},
{
"id": 2,
"product": 1,
"user": "john doe",
"text": "yes its ok.",
"publish": true,
"parent_id": 1,
},
{
"id": 3,
"product": 1,
"user": "shiva",
"text": "how can i .. . .",
"publish": true,
"parent_id": null,
},
]
the second item ( id 2 ) is response for question 1 because it have partent_id = 1 and id 3 is independent question
i want to show each responses under its own question in nested orded list
if the question have any response.. how can i do that ?
i did somthing like this but it think it complatly wrong can anyone guide my to do that correctly ? thanks
my component for get questions and answers
this._store.viewSingleProductQA(this.product.product_id).subscribe(data => {
this.questions = data;
this.responses = this.questions.filter(d => d.parent_id == this.questions.id)
});
html :
<div>{{question?.user}}</div>
<div>{{question.text}}</div>
</div>
<div *ngFor="let res of responses">
{{res.text}}
</div>
解决方案
Try this HTML, where responses is as follows
responses = [
{
"id": 1,
"product": 1,
"user": "alex",
"text": "is it ok?",
"parent_id": null,
},
{
"id": 2,
"product": 1,
"user": "john doe",
"text": "yes its ok.",
"publish": true,
"parent_id": 1,
},
{
"id": 3,
"product": 1,
"user": "shiva",
"text": "how can i .. . .",
"publish": true,
"parent_id": null,
},
]
<div *ngFor="let res of responses">
<div *ngIf="res.parent_id === null">
Ques : {{res.text}}
<br/>
Answers :
<ng-container *ngFor="let res2 of responses">
<div *ngIf="res2.parent_id === res.id">
{{res2.text}}
</div>
</ng-container>
</div>
</div>
Check this fiddle
这篇关于angular 5 显示嵌套问题和答案在其父项下显示项的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
