CODEWITHSUNDEEP
checkboxionic4ion-checkbox
dhammani
dhammani

Reputation: 141

How to get an array of multi checkbox on ionic4?

I'm trying to get an array with a multi checkbox on ionic 4, can someone help me? 

        <ion-item>
          <ion-label position="floating">0</ion-label>
          <ion-checkbox  color="primary" value="0"></ion-checkbox>
        </ion-item>

        <ion-item>
          <ion-label position="floating">1</ion-label>
          <ion-checkbox color="secondary" value="1"></ion-checkbox>
        </ion-item>

        <ion-item>
          <ion-label position="floating">2</ion-label>
          <ion-checkbox color="danger" value="2"></ion-checkbox>
        </ion-item>

        <ion-item>
          <ion-label position="floating">3</ion-label>
          <ion-checkbox color="light" value="3"></ion-checkbox>
        </ion-item>

Upvotes: 0

Views: 409

Answers (1)

Eve Edomenko
Eve Edomenko

Reputation: 510

So you want to get an array from your .ts file to your html dynamically and load the content into the ion-items? Set a global variable into your .ts file. Lets call it data.

Then your html should look like this: home.html:

<ion-list *ngFor="let data-object of data">
    <ion-item>
      <ion-label position="floating">{{data-object.value}}</ion-label>
      <ion-checkbox color="secondary" value="{{data-object.value}}"></ion-checkbox>
    </ion-item>
</ion-list>

Where data is your array with data objects.

Upvotes: 1

Related Questions