Ionic 2 读取复选框值 [英] Ionic 2 read checkbox value

问题描述

我无法读取 ionic 2 中的复选框值我尝试了以下代码

I am unable to read checkbox value in ionic 2 i tried following code

<div class="form-group">
            <label ></label>
            <div *ngFor="let mydata of activity" >
                <label>
                        <input type="checkbox"
                           name="activity"
                           value="{{mydata.activity_id}}"

                            [checked]="activity.includes(mydata)" 

             (change)="changeSchedules(mydata)"
                           />
                    {{mydata.activity_name}}

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

脚本文件

this.subscriptionForm = new FormGroup({

        activity: new FormArray(this.subscription.schedules.map(schedule => new FormControl(schedule)), Validators.minLength(1))
    });

changeSchedules(mydata: any) {

  var currentScheduleControls: FormArray = this.subscriptionForm.get('activity') as FormArray;
  var index = currentScheduleControls.value.indexOf(mydata);


    if(index > -1) 
    {currentScheduleControls.removeAt(index) }

    else 
{

    currentScheduleControls.push(new FormControl(mydata));
}

}

我搜索了很多东西，但我没有得到正确的解决方案有人可以帮助解决这个问题

i searche so many things but i did not get proper solution can somebody help to figure out this

推荐答案

请关注我觉得对你有帮助

Please following i think it will help you

您的 .ts 文件代码

your .ts file code

export class FormComponent {
 cbArr: string[];
    cbChecked: string[];
  constructor() {
    this.cbArr = ['OptionA', 'OptionB', 'OptionC'];
    this.cbChecked = [];
  }

  powers = ['Really Smart', 'Super Flexible',
            'Super Hot', 'Weather Changer'];

  model = new Hero(18, 'Dr IQ', this.powers[0], 'Chuck Overstreet');

  submitted = false;



  // TODO: Remove this when we're done
  get diagnostic() { return JSON.stringify(this.model); }

updateCheckedOptions(chBox, event) {
      var cbIdx = this.cbChecked.indexOf(chBox);

      if(event.target.checked) {
          if(cbIdx < 0 ){
               this.cbChecked.push(chBox);
             console.log(chBox);
          }

      } else {
          if(cbIdx >= 0 ){
             this.cbChecked.splice(cbIdx,1);
              console.log(cbIdx);
          }

      }
  }
   updateOptions() {
    console.log(this.cbChecked);
  }
  /////////////////////////////

}

和你的 html 代码

and your html code

      <label for="options">Options :</label>
        <div *ngFor="let cbItem of cbArr">
          <label>
            <input type="checkbox"
                   name="options"
                   value="{{cbItem}}"
                   [checked]="cbChecked.indexOf(cbItem) >= 0"
                   (change)="updateCheckedOptions(cbItem, $event)"/>
            {{cbItem}}
          </label>
 <button (click)="updateOptions()">Post</button>

updateOptions() 你会得到所有选中的复选框值

updateOptions() you will get all selected check box value

这篇关于Ionic 2 读取复选框值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！