שיעור 17 ב-ionic, שימוש ב toggleButton

כחלק מרכיבי ה-CSS של ionic , יש גם toggle button, כפתור דו מצבי נחמד.

בקוד הבא אפשר לראות :

  • שימוש בתגית ion-toggle, כדי לשים כפתור דו מצבי על המסך.
  • שימוש ב-[checked] על מנת לקשור אליו משתנה\פונקציה כדי שערכו ישמר.
  • על הדרך , אך ללא קשר, השתמשתי ב- ion-grid – שמאוד דומה לבוטסטראפ, וב-ion-label שמאפשר לשים תויות פשוטות ונחמדות.
<ion-content padding>
 <ion-grid>
 <ion-row>
 <ion-col>
 <ion-label>
 רקע שונה
 </ion-label>
 </ion-col>
 <ion-col>
 <ion-toggle 
 (ionChange)="onToggle($event)" 
 [checked]="checkAltBackground()" ></ion-toggle>
 </ion-col>
 </ion-row>
 </ion-grid>
</ion-content>

 

כתיבת תגובה

האימייל לא יוצג באתר. שדות החובה מסומנים *