mardi 19 mars 2019

How can I access the checked property of a checkbox which is indexed by an *ngFor loop - Angular

I have a list of drop-down elements, which is indexed by an *ngFor loop.

<div class="item-wrapper" *ngIf="showItems">
  <div class="wrap-collapsible" *ngFor="let item of items; let i = index">
    <input id="" class="toggle" type="checkbox">
    <label for="" class="dropdown-toggle" tabindex="0" (click)="selectItem(item)">
      Threat : 
    </label>
    <div class="collapsible-content">
      <div class="content-wrapper">
        <p class="title"></p>
      </div>
    </div>
  </div>
</div>

Per default, the checkbox input is selected on click, and stays checked when selecting other elements.

How would I go about unchecking all elements except the last one clicked?

I've tried doing...

<input id="" type="checkbox" [checked]="i == selectedElement">

...while passing the index in the selectItem() method, where selectedElement is set to i. This doesn't work, because then no item is selectable.

Can anyone give me a push in the right direction?




Aucun commentaire:

Enregistrer un commentaire