Блог

Здесь я редактирую динамический флажок , но во время редактирования формы значения полученного массива помещаются в массив, затем, когда мы проверили значение, отмеченное значение помещается в тот же массив, До такой степени это работает правильно, но когда я снимаю флажок, значения сращиваются неправильно, сначала выскакивает недавно вставленное значение, и снова, если мы попытаемся снять флажок, проверенное значение, весь флажок становится снятым и появляется только одно значение.

 Html
<div class="pb-2 pt-2 mt-2">
                <label for="exampleFormControlInput1" class="form-label">Facilities</label>
                <div class="form-check" *ngFor="let facilitie of facilityData; let i= index">
                    <input class="form-check-input" type="checkbox" id="flexCheckDefault" 
                        [value]="facilitie.facilityId"
                        [checked]="selectIdFacility.includes(facilitie.facilityId)" 
                        (click)="change($event)">
                    <label class="form-check-label" for="flexCheckDefault">
                        {{facilitie.name}}
                    </label>
                </div>
</div>

typescript

  fac:any;
  selectIdFacility:any=[];
 this.fac=this.hotel.facilities
      if(this.fac ){
        this.fac.forEach((element:any) => {
          this.selectIdFacility.push(element.facilityId);
          console.log(this.selectIdFacility);
          
         });
      }
change(event:any){
    if(event.target.checked){
     this.selectIdFacility.push(event.target.value)
     console.log(event.target.value);
     
    }
    else{
      const index:number = this.selectIdFacility.indexOf(event.target.value)
      this.selectIdFacility.splice(index,1)
      console.log(index);
    }
   console.log(this.selectIdFacility)
  }
 

Приведенный выше код представляет собой его текущую реализацию. Так есть ли что-нибудь, что я делаю неправильно?