lundi 12 juin 2017

Ionic2,Angular2: [(ngModel)] for ion-checkbox or html checkbox?

What should the [(ngModel)] in the following case be,such that I can persist the state of the checkbox in the slide ? I need to slide from one slide to another upon selecting the checkboxes but when I click previous the state needs to be persisted.

Here is what I've for radio buttons. I just changed the radio buttons code into checkbox but it is not working.So I removed the [value] property and now if I select one checkbox, all of them are getting checked.

    <ion-content padding>

      <ion-slides>
        <ion-slide *ngFor="let question of questions; let i = index">
          <h1></h1>
           <span *ngIf="question.type=='singlecorrect'>
          <ion-list radio-group [(ngModel)]="question.answer">
            <ion-item no-lines no-padding *ngFor="let choice of question.choices">
              <ion-label></ion-label>
              <ion-radio [value]="choice"></ion-radio>
            </ion-item>
          </ion-list>
          </span>

           <span *ngIf="question.type=='singlecorrect'>
          <ion-list checkbox-group [(ngModel)]="question.answer">
            <ion-item no-lines no-padding *ngFor="let choice of question.choices">
              <ion-label></ion-label>
              <ion-checkbox></checkbox>  // ERROR : no value accessor found. 
            </ion-item>
          </ion-list>
          </span>

          <ion-row margin-top>
            <ion-col>
              <button (click)="showPrevious()" ion-button text-only [disabled]="i === 0" >Previous</button>
            </ion-col>
            <ion-col>
              <button [disabled]="!question.answer" *ngIf="i < questions.length - 1" (click)="showNext()" ion-button text-only >Next</button>
              <button [disabled]="!question.answer" *ngIf="i === questions.length - 1" (click)="showNext()" ion-button text-only >Submit</button>
            </ion-col>
          </ion-row>

        </ion-slide>
      </ion-slides>

</ion-content>

I'm storing the selected choices in an array called "answer".Refer this:Angular2,Typescript: How to put the radio button checked when in an array which displays one element per page? Can someone help me? Thanks in advance.




Aucun commentaire:

Enregistrer un commentaire