我在angular2中有一个动态表
<table>
<tbody>
<tr *ngFor="let dataList of dataLists; let i = index" [attr.data-index]="i">
<td>{{dataList.Name}}</td>
<td><div (click)="onClick(i)"><span class="glyphicon" [ngClass]="{'glyphicon-chevron-up': opendPanel , 'glyphicon-chevron-down': !opendPanel }"></span></div></td>
</tr>
</tbody>
</table>
最后一列是向下箭头（glyphicon-chevron-up），单击后应更改为（glyphicon-chevron-down）我的问题是，一旦单击，所有行图标都会更改。我只想更改所选行的图标。
您正在使用单个布尔变量opendPanel，这就是为什么更改其值会影响表的所有其他行的原因。
为了完成您的任务，您可以在dataList对象中具有新属性，并按如下所示使用它：
<table>
<tbody>
<tr *ngFor="let dataList of dataLists; let i = index" [attr.data-index]="i">
<td>{{dataList.Name}}</td>
<td><div (click)="onClick(i,dataList)"><span class="glyphicon" [ngClass]="{'glyphicon-chevron-up': dataList.opendPanel , 'glyphicon-chevron-down': !dataList.opendPanel }"></span></div></td>
</tr>
</tbody>
</table>
在组件端，在onClick事件中设置dataList.opendPanel的值。
希望能帮助到你！！
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句