Reputation: 375
Good day! Im fairly new to ionic and mobile dev. Im making a simple reminder app and Im implementing ion-toggle Here what my code looks like,
<ion-item class="item-avatar" ng-repeat="med in meds.medications" >
<img ng-src={{med.medicine.image_url}} style="top: 25px;">
<div class="row">
<div class="col col-50 col-center">
<h2>{{ med.medicine.name }}</h2>
<p>{{ med.dose +' '+med.type }}</p>
<p style="font-weight: bold" >{{ med.time }}</p>
</div>
<div class="col" style="border: 0">
<ion-toggle ng-checked="!med.status" toggle-class="toggle-calm" style="border: 0;"> </ion-toggle>
</div>
</div>
<ion-option-button class="button-positive" ng-click="meds.showEditMed(med)">Edit</ion-option-button>
<ion-option-button class="button-assertive" ng-click="meds.showDeleteMed(med)">Delete</ion-option-button>
</ion-item>
I have a very weird problem, whenever I put ng-change on my ion-toggle, the option button shows up. Ive looked up the net for some solutions, none of which have this the same problem.
Here is an image of my problem
Thank you very much for your help
Upvotes: 1
Views: 107
Reputation: 2109
Use ng-model on ion-toggle, here is the sample code:
<ion-toggle ng-model="someVariable" ng-checked="!med.status" toggle-class="toggle-calm" style="border: 0;"> </ion-toggle>
Upvotes: 2