1、ion-input 单行文本框
<ion-list>
<ion-item>
<ion-label>用户名:</ion-label>
<ion-input [(ngModel)]="peopleInfo.username"></ion-input>
</ion-item>
<ion-item>
<ion-label>年 龄:</ion-label>
<ion-input [(ngModel)]="peopleInfo.age"></ion-input>
</ion-item>
</ion-list>
2、ion-toggle开关
<ion-item>
<ion-label>是否本科</ion-label>
<ion-toggle slot="end" [(ngModel)]="peopleInfo.falg"></ion-toggle>
</ion-item>
3、ion-radio-group、ion-radio 单选按钮组
<ion-list>
<ion-radio-group [(ngModel)]="peopleInfo.payType">
<ion-item>
<ion-avatar slot="start">
<img src="assets/alipay.png">
</ion-avatar>
<ion-label>支付宝</ion-label>
<ion-radio value='1' slot="end"></ion-radio>
</ion-item>
<ion-item>
<ion-avatar slot="start">
<img src="assets/weixinpay.png">
</ion-avatar>
<ion-label>微信</ion-label>
<ion-radio value='2' slot="end"></ion-radio>
</ion-item>
</ion-radio-group>
</ion-list>
4、ion-checkbox 多选按钮组
<ion-list>
<ion-item *ngFor="let item of peopleInfo.checkBoxList">
<ion-label>{{item.val}}</ion-label>
<ion-checkbox slot="start" [(ngModel)]="item.isChecked"></ion-checkbox>
</ion-item>
</ion-list>
5、ion-select 选择框
<ion-list>
<ion-select slot="end" [(ngModel)]="peopleInfo.city">
<ion-select-option *ngFor="let item of peopleInfo.cityList" [value]="item">
{{item}}
</ion-select-option>
</ion-select>
</ion-list>
6、ion-textarea 多行文本框
<ion-list>
<ion-item>
<ion-textarea [(ngModel)]="peopleInfo.info">
</ion-textarea>
</ion-item>
</ion-list>