Pass an id through a checkbox at Angular 5

Question

I need to pass an id through a method in a form when my checkbox is checked. I have tried it in several ways with no results.

Below follows the code

{{Event.name}}

            <div class=" col-3 simple-Input">
              <div class="row">
                <label for=""></label>
              </div>
              <div class="row">
                <label for="">{{event.date}}</label>
              </div>
              <div class="row">
                <label for="">{{event.adress_id}}</label>
              </div>

            </div>

            <div class="col-3">
              Mapas
            </div>
            <div class="col-6 simple-Input">

                <table class="col-12">
                  <thead>
                    <th>convidado</th>
                    <th>convidar</th>
                    <th>confirmação</th>
                  </thead>
                  <tr *ngFor="let guest of guests">
                    <th>{{guest.name}}</th>
                    <th>{{guest.id}}</th>
                    <th>
                      <input type="checkbox" [ngModel]="eventGuest" id="eventGuest" autocomplete="off" name="guest.id" [value]="guest.id">
                    </th>

                    <td style="text-align:center;">
                      <fa-icon *ngIf="guest.confirmed==1" [icon]="faCheckSquare"></fa-icon>
                      <fa-icon *ngIf="guest.confirmed==0" [icon]="faSquare"></fa-icon>
                    </td>

                  </tr>

                </table>
                <div class="col-4" style="align-items: flex-end; display: flex; justify-content: flex-end;">
                  <div class="submit-Input">
                    <input type="submit" value="Convidar">
                  </div>
                </div>


            </div>
          </div>
        </div>

      </form> 

Answer 1

Just use the ngModelChange in the input.

html

<input type="checkbox" id="1"
       [ngModel]="filter" (ngModelChange)="onFilterChange($event)"> Checkbox

TS

export class HelloWorld {

  filter = false;

  onFilterChange(event: any) {
    console.log(event);
    this.filter = !this.filter;
  }
}

I hope it helps!

Here the example already working https://codesandbox.io/embed/q9rvn6kpq