Angular 2 - Bootstrap - Collapse

Question

我的问题是，如何为所有折叠项目创建自己的ID？

问题是，如果我点击列表中的某个地方总是第一个项目被折叠。我尝试给div的data.id，但它不工作。

<div class="container"> 
<div *ngFor="let data of data.data"> 
    <div class="panel-group"> 
    <div class="panel panel-default"> 
    <div class="panel-heading"> 
     <h4 class="panel-title"> 
     <a data-toggle="collapse" href="#{data.id}}">{{data.subject}}</a> 
     </h4> 
    </div> 
    <div id="{data.id}}" class="panel-collapse collapse"> 
     <div class="panel-body">{{data.id}}</div> 
     <div class="panel-footer">{{data.name}}</div> 
    </div> 
    </div> 
</div> 
</div> 
</div> 

Answer 1

下面有一个错误。

<a data-toggle="collapse" href="#{data.id}}">{{data.subject}}</a> 

这行：

<div id="{data.id}}" class="panel-collapse collapse"> 

花括号在这里失踪href="#{data.id}}这里id="{data.id}}"