将它应用于元素的* ngFor时的类绑定

Question

我需要一些帮助，由于某种原因，我无法想到如何解决它

我有一个对象数组，我正在使用* ngFor循环

我想在我的数组中添加类绑定到字段（描述详细信息），但我不希望每个'详细描述'都发生这种操作

只是我正在与之合作的人。不确定这是否可行。希望我有意义。 目前，当我展开“详细描述”时，每个具有“详细描述”的对象也会扩展（不希望发生这种情况）！ ------ HTML -----------

<div *ngFor="let n of Entry">
        <ul class="list-group">
         <li>
          <p class="description"> Detailed Description
           <span class="glyphicon" [class.glyphicon-minus- 
           sign]="expandedDetails" [class.glyphicon-plus- 
           sign]="!expandedDetails" (click)="toggleDetails()"></span>
            </p>
            <span class="entryDetails" *ngIf="expandedDetails == true"> 
             {{n.description}}</span>

--------- TS ----------------------

toggleDetails() {
this.expandedDetails = !this.expandedDetails;

}

Answer 1

试试这个

在ts文件中定义切换变量

 toggle=[]

在你的HTML中修改你的代码就像这样

<div *ngFor="let n of Entry;let i =index">
        <ul class="list-group">
         <li>
          <p class="description"> Detailed Description
           <span class="glyphicon" [class.glyphicon-minus- 
           sign]="expandedDetails" [class.glyphicon-plus- 
           sign]="!expandedDetails" (click)="toggle[i]=toggle[i]  "></span>
            </p>
            <span class="entryDetails" *ngIf=" toggle[i]"> 
             {{n.description}}</span>

Answer 2

您希望在for-each上使用trackby $ index，然后您可以使用此值传递给toggleDetails。因此，您只会打开该行/项目的详细信息。

让我举个例子