Question

我有一个嵌套的ngFor Checkbox ..我只需要设置NgModel来检查复选框是否被选中？

<ion-item-group *ngFor="let patient of Patients; let i= index">
<ion-item-divider color="light">{{patient.conditionGroup}}</ion-item-divider>
<ion-item *ngFor="let condition of patient.conditions; let j= index">
<ion-label>{{condition}}</ion-label>
<ion-checkbox id="{{condition}}" [(ngModel)]="checkStatus[i][j]" (ionChange)="mylist(i,j,condition)" color="danger"></ion-checkbox>
</ion-item>
</ion-item-group>

我的控制器是这样的..

  {
    this.checkStatus=[];
    this.Patients = [];

    for(var s=0;s<this.Patients.length;s++)
    {this.checkStatus[s]=[];}
    }

How do i check if the checkbox is checked.. error
    ERROR TypeError: Cannot read property '0' of undefined

患者

[
      {
        "conditionGroup": "Family Care",
        "conditions": [
          "Head",
          "Poisoning",
          "Stroke"
        ]
      }
]

在myList（）中我需要将选中的选项推送到数组中。

Answer 1

控制器代码

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {
  checkStatus = [];
  Patients = [];

  constructor(public navCtrl: NavController) {

    this.initPatients();
  }

  initPatients(){
     this.Patients = [
      {
        "conditionGroup": "Family Care",
        "conditions": [
          "Head",
          "Poisoning",
          "Stroke"
        ]
      },
      {
        "conditionGroup": "Family Care",
        "conditions": [
          "Head",
          "Poisoning",
          "Stroke"
        ]
      },
      {
        "conditionGroup": "Family Care",
        "conditions": [
          "Head",
          "Poisoning",
          "Stroke"
        ]
      }
    ];
     this.updateStatus();
  }
  updateStatus() {
    for (var s = 0; s < this.Patients.length; s++)
    { this.checkStatus[s] = []; }
  }



}

Html代码

<ion-header>
  <ion-navbar>
    <ion-title>Home</ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>
 <ion-item-group *ngFor="let patient of Patients; let i= index">
<ion-item-divider color="light">{{patient.conditionGroup}}</ion-item-divider>
<ion-item *ngFor="let condition of patient.conditions; let j= index">
<ion-label>{{condition}}</ion-label>
<ion-checkbox id="{{condition}}" [(ngModel)]="checkStatus[i][j]" (ionChange)="mylist(i,j,condition)" color="danger"></ion-checkbox>
</ion-item>
</ion-item-group>
</ion-content>

如何为嵌套的ngFor ion-checkbox设置Ngmodel？

1 个答案: