mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-20 12:29:55 +08:00
chore(demos): update checkbox demo
This commit is contained in:
@ -3,4 +3,23 @@ import {App} from 'ionic/ionic';
|
||||
@App({
|
||||
templateUrl: 'main.html'
|
||||
})
|
||||
class ApiDemoApp {}
|
||||
class ApiDemoApp {
|
||||
data;
|
||||
|
||||
constructor() {
|
||||
this.data = {
|
||||
jon: true,
|
||||
daenerys: true,
|
||||
arya: false,
|
||||
tyroin: false,
|
||||
sansa: true,
|
||||
khal: false,
|
||||
cersei: true,
|
||||
stannis: true,
|
||||
petyr: false,
|
||||
hodor: true,
|
||||
catelyn: true
|
||||
};
|
||||
}
|
||||
|
||||
}
|
||||
|
@ -6,64 +6,65 @@
|
||||
<ion-list>
|
||||
|
||||
<ion-item>
|
||||
<ion-checkbox checked="true"></ion-checkbox>
|
||||
<ion-checkbox [(ngModel)]="data.jon"></ion-checkbox>
|
||||
<ion-label>Jon Snow</ion-label>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-checkbox dark checked="true"></ion-checkbox>
|
||||
<ion-checkbox dark [(ngModel)]="data.daenerys"></ion-checkbox>
|
||||
<ion-label>Daenerys Targaryen</ion-label>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-checkbox value="cherry" disabled="true"></ion-checkbox>
|
||||
<ion-checkbox [(ngModel)]="data.arya" disabled="true"></ion-checkbox>
|
||||
<ion-label>Arya Stark</ion-label>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-checkbox secondary></ion-checkbox>
|
||||
<ion-checkbox [(ngModel)]="data.tyroin" secondary></ion-checkbox>
|
||||
<ion-label>Tyrion Lannister</ion-label>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-checkbox danger checked="true"></ion-checkbox>
|
||||
<ion-checkbox [(ngModel)]="data.sansa" danger></ion-checkbox>
|
||||
<ion-label>Sansa Stark</ion-label>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-checkbox></ion-checkbox>
|
||||
<ion-checkbox [(ngModel)]="data.khal"></ion-checkbox>
|
||||
<ion-label>Khal Drogo</ion-label>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-checkbox energized checked="true" dark></ion-checkbox>
|
||||
<ion-checkbox [(ngModel)]="data.cersei" dark></ion-checkbox>
|
||||
<ion-label>Cersei Lannister</ion-label>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-checkbox royal checked="true"></ion-checkbox>
|
||||
<ion-checkbox [(ngModel)]="data.stannis"></ion-checkbox>
|
||||
<ion-label>Stannis Baratheon</ion-label>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-checkbox disabled="true"></ion-checkbox>
|
||||
<ion-checkbox [(ngModel)]="data.petyr" disabled="true"></ion-checkbox>
|
||||
<ion-label>Petyr Baelish</ion-label>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-checkbox dark checked="true"></ion-checkbox>
|
||||
<ion-checkbox [(ngModel)]="data.hodor" dark></ion-checkbox>
|
||||
<ion-label>Hodor</ion-label>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-checkbox secondary checked="true"></ion-checkbox>
|
||||
<ion-checkbox [(ngModel)]="data.catelyn" secondary></ion-checkbox>
|
||||
<ion-label>Catelyn Stark</ion-label>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-checkbox royal></ion-checkbox>
|
||||
<ion-checkbox [(ngModel)]="data.bronn" royal></ion-checkbox>
|
||||
<ion-label>Bronn</ion-label>
|
||||
</ion-item>
|
||||
|
||||
</ion-list>
|
||||
|
||||
</ion-content>
|
||||
|
Reference in New Issue
Block a user