当前位置:网站首页>Ionic5 form input box and radio button

Ionic5 form input box and radio button

2022-06-23 09:09:00 kenick

Page effects

html file

  <ion-list>
    <div>
      <ion-input type="text" value="" maxlength="30" placeholder=" Please enter the secondary distribution mobile number ( Registered )" [(ngModel)]="phone"></ion-input>
    </div>

    <ion-radio-group [(ngModel)]="operate" >
      <ion-list-header>
        <ion-label> Please click on the options below :</ion-label>
      </ion-list-header>
      <ion-item>
        <ion-label> Authorized distribution </ion-label>
        <ion-radio slot="start" value="1"></ion-radio>
      </ion-item>
      <ion-item>
        <ion-label> Cancel distribution </ion-label>
        <ion-radio slot="start" value="0"></ion-radio>
      </ion-item>
    </ion-radio-group>
  </ion-list>

ts file

export class DistributionPage implements OnInit {

    public phone: any;
    public operate:1;

    constructor(
        public router: Router,
        public httpUtil: HttpUtil,
        public commonService: CommonService,
        public commonUtil: CommonUtil
    ) {

    }

    ngOnInit() {
        
    }

    ionViewWillEnter() {

    }

    grantSecondDistribution(){
        console.trace("grantSecondDistribution.in,phone:"+this.phone+",operate:"+this.operate);
        
    }

}

原网站

版权声明
本文为[kenick]所创,转载请带上原文链接,感谢
https://yzsam.com/2022/06/202206230902016054.html