角度2のngFor内の個々のアイテムを非表示/表示する

Question

スパン（アクティブ）をクリックした後にドロップダウンを表示し、特定の値を選択した後にドロップダウンを非表示にして、個別にスパンします。それを達成する方法？

<table class="table"> 
    <tbody> 
     <tr *ngFor="let user of data | paginate: config; let i">    
      <td class="row"> 
       <a [routerLink]="['/user-edit', user.Id]" style="text-transform: capitalize;">{{user.FirstName}} {{user.LastName}}</a><br /> 
       {{user.Email}}<br /> 
       <i class="fa fa-user"></i> Developer 
      </td> 
      <td style="width:15px;" *ngIf="user.IsActive==false"><br /><br /><b>Blocked</b></td> 
      <td *ngIf="user.IsActive==true"> 
       <div class="inline-edit"> 
        <span [hidden]="!isDisplay" (click)="beginEdit(editText,i)"> 
         Active 

        </span> 
        <span> 
         <ng-select [items]="items" 
         (selected)="selected($event,i)"> 
        </ng-select> 
       </span> 
      </div> 
     </td> 
    </tr> 
</tbody> 
</table> 

Answer 1

フラグ変数isDisplayを使用しました。これは、すべてのループで同じです。そこに、すべてのループのフラグを区別するためにユーザーからのIDを追加します。私も

重複の可能

<table class="table"> 
    <tbody> 
     <tr *ngFor="let user of data | paginate: config; let i">    
      <td class="row"> 
       <a [routerLink]="['/user-edit', user.Id]" style="text-transform: capitalize;">{{user.FirstName}} {{user.LastName}}</a><br /> 
       {{user.Email}}<br /> 
       <i class="fa fa-user"></i> Developer 
      </td> 
      <td style="width:15px;" *ngIf="user.IsActive==false"><br /><br /><b>Blocked</b></td> 
      <td *ngIf="user.IsActive==true"> 
       <div class="inline-edit"> 
        <span [hidden]="!isDisplay[user.id]" (click)="beginEdit(editText,i)"> 
         Active 

        </span> 
        <span> 
         <ng-select [items]="items" 
            (selected)="selected($event,i)"> 
         </ng-select> 
        </span> 
       </div> 
      </td> 
     </tr> 
    </tbody> 
</table>