单击离子列表项上的 Change CheckBox 状态时更新数组中的对象？

Question

我在它的每一行都有一个列表和一个复选框。我希望每当我点击一个复选框时，对象需要相应地根据复选框状态更新，但是当我点击复选框时使用我的下面我得到异常像 Unable to set 属性 'checked ' of undefined or null reference 有人能帮我吗我在哪里做了 mi-stack

.ts:

export class Custom{
  name: string
  empoloyeeID: number
  checked:boolean
}

export class CheckboxListPage {

  contacts:Array<Custom> = [];
  constructor(public navCtrl: NavController, public navParams: NavParams) {

    let customObj1 = new Custom();
    customObj1.empoloyeeID = 1;
    customObj1.name = "Ramakrishna"; 

    let customObj2 = new Custom();
    customObj2.empoloyeeID = 2;
    customObj2.name = "Ramakrishna2"; 

    this.contacts.push(customObj1);
    this.contacts.push(customObj2);

  }

  updateCucumber(contact){
        this.contacts[contact.empoloyeeID].checked = !contact.checked;
  }

.html:

<ion-content padding>
  <ion-list>
        <ion-item *ngFor="let contact of contacts" (click)="update(contact)">
            <!-- <ion-avatar item-start>
              <img src="imgs/img_snow.jpg">
            </ion-avatar> -->
            <ion-avatar item-left>
                <img src="https://ionicframework.com/dist/preview-app/www/assets/img/marty-avatar.png">
              </ion-avatar>
             <h2>{{contact.name}}</h2>
            <p *ngIf="contact.id===1;else other_content">your if block</p>
            <ng-template #other_content><p>your else block1</p></ng-template>

            <ion-row>
                <ion-col col-2 no-padding no-margin>
                  <ion-item no-padding no-margin no-lines>
                    <ion-checkbox [(ngModel)]="contact.checked" (ionChange)="updateCucumber(contact)"></ion-checkbox>
                  </ion-item>
                </ion-col>
                <ion-col col-10 no-padding no-margin>
                  <ion-item no-padding no-margin no-lines>
                    Agree to <a target="_blank" href="http://www.terms-of-service.com">Terms of Service</a>
                     and <a target="_blank" href="http://www.privacy-policy.com">Privacy Policy</a>.
                  </ion-item>
                </ion-col>
              </ion-row>

          </ion-item>


</ion-list>
</ion-content>

Answer 1

无需添加事件侦听器来更新模型（联系人）的值。正如您在 html 文件中绑定（双向）属性一样。

单击离子列表项上的 Change CheckBox 状态时更新数组中的对象？

Updated object in Array when Change CheckBox state on ion- list item click?

ionic3

ion-checkbox

.ts:

.html: