ionic2 + cordova 应用-表单

techWang 2017-06-14

4.1 静态页面login.html(欢迎加入Q群一起学习讨论657185219)

<ion-content padding>
  <form [formGroup]="loginForm" >
    <ion-item>
      <ion-label>Username</ion-label>
      <ion-input type="text" formControlName="LoginID"></ion-input>
    </ion-item>
    <!-- 有问题的提示语 -->
    <p *ngIf="!loginForm.controls.LoginID.valid && loginForm.controls.LoginID.touched" color="danger">LoginID must is email.</p>
    <!-- <p *ngIf="loginForm.controls.LoginID.valid && loginForm.controls.LoginID.touched" secondary> LoginID is good</p>-->

    <ion-item>
      <ion-label>Password</ion-label>
      <ion-input type="password" formControlName="LoginPwd"></ion-input>
    </ion-item>

    <ion-item>
      <button ion-button  (click)="login(loginForm.value, $event)" [disabled]="!loginForm.valid">登录</button>
      <button ion-button  (click)="signup()">注册</button>
    </ion-item>

  </form>
</ion-content>
 主要使用了[formGroup],loginForm.controls 俩个属性

相关推荐