每个元素的下拉/下拉元素（Angular 4）

Question

我想为数组中的每个元素创建下拉/下拉元素：

  <div *ngFor="let hotel of hotels">
    <div>Photo</div>
    <div>{{ hotel.name }}</div>
    <div><button (click)="changeIsShohToTrue()" type="button" class="btn btn-default btn"><i class="glyphicon glyphicon-align-justify"></i></button></div>

    <div *ngIf="isShow">Additional information</div>
  </div>  

主要思想是当点击按钮系统下拉/下拉 div 时带有元素点击的附加信息。

在我的实现中打开/关闭所有额外的 div，如何实现仅针对元素点击的下拉/下拉 div？

Answer 1

将isShown 放在每个酒店对象上，这意味着您在函数中设置hotel.isShown =true，然后相应地更改条件：*ngIf="hotel.isShown"

Answer 2

您可以在酒店模型中添加布尔字段“isShowAddInfo”，更改

<div *ngIf="hotel.isShowAddInfo">Additional information</div>

，并将 onClick 事件处理程序更改为

(click)="changeIsShohToTrue(hotel)

在处理程序中只需切换“isShowAddInfo”。