html - Angular tablo - tıklayınca gizli öğeyi göster

Bir tablo sütunum var ve bu sütunda bir giriş alanı var, giriş alanını sadece butona tıklandığında göstermek istiyorum. Tıklandığında göstermek için ng-if kullanıyordum, ancak butona tıklandığında tüm giriş elemanları görüntüleniyor. Sadece bir satırın giriş alanını göstermek istiyorum.

HTML

    <td *ngIf="!hideStockLevels && row.">
      <div>
        <button class="btn btn-primary" (click)="showInput(row)">Add unit</button>
      </div>
    </td>

    <td *ngIf="!hideStockLevels && !this.isButtonVisible" [hidden]="this.isButtonVisible">
     <input (focusout)="updateUnit(row)" class="inputWidth" [(ngModel)]="unitMap[row.id]" type="text"  value="{{row.Unit}}" [disabled]="dateReceived !== null">
     </td>

Cevap #1

Her satırın hangi satırı gösterip/gizleyeceğimizi bilmemiz için benzersiz bir tanımlayıcıya sahip olması gerekir. Siz sadece bir değişken kullanıyorsunuz. Her nesneye, örneğin tıklayınca değiştirdiğiniz başka bir (boolean) özellik ekleyin:

<td>
   <button (click)="row.hidden = !row.hidden">Add unit</button>
</td>

<td [hidden]="row.hidden">
  <input .... />
</td>

Girdiğin zaman ne zaman gizlenmesi gerektiğini nasıl değiştirileceğini bilmiyorum, ama sonra bunu yapmak istediğinde sadece hidden özelliğini false olarak değiştir.