Как получить значение mat-checkbox

Question

Я новичок с angular материалом. Я написал этот код до сих пор:

Answer {
    id: string;
    content: string;
}

<section *ngFor="let opt of step.answers">
                            <mat-checkbox [checked]="opt.id" (change)="check($event)">
                                <p [innerHTML]="opt.content"> </p>
                           </mat-checkbox> 
</section>

Я до сих пор не могу понять, как получить идентификатор для каждой опции, выбранной на каждом шагере, и собрать их в массив

Answer 1

так что это решение, которое я нашел, оно близко к предложению @ Çağrı, но я изменил несколько вещей, так как у «события» есть проверенный атрибут, который я могу использовать, не используя переменную для сохранения значения «isChecked»

check(event, opt, userResponse) {

        var rep = [];
      
        if (event.checked === true) {
            userResponse.push(opt);
        }

        if (event.checked === false) {
            var index: number = userResponse.indexOf(opt);
            userResponse.splice(index, 1);
            
        }
    }

<section *ngFor="let opt of step.answers"  >
   <mat-checkbox (change)="check($event,opt,step.userResponse)">
       <p [innerHTML]="opt.content"> </p>
    </mat-checkbox> 
</section>

Answer 2

в [проверено] состоянии вы не можете поставить идентификатор. Это истинное ложное состояние. U должен добавить еще один атрибут модели step.answers, которая вызывает ischecked, чье начальное значение равно false. и создайте глобальный массив с именем choosenanswers и напишите

Answer {
    id: string;
    content: string;
    ischecked:boolean=false;
}

, затем

 <section *ngFor="let opt of step.answers">
         <mat-checkbox [checked]="opt.ischecked" (change)="check($event)">
              <p [innerHTML]="opt.content"> </p>
          </mat-checkbox> 
    </section>

, затем в событии проверки в компонентах

  check(event){
      this.choosenanswers=[];
      this.step.answers.foreach(x=>{if(x.ischecked){ this.choosenanswers.push(x.id);}})
    }