如何禁用按鈕時表單域是離子空或無效2

我在離子2是新的，我創建一個新的形式，那麼我想驗證的如何禁用按鈕時表單域是離子空或無效2

表單字段我home.ts應用驗證

export class HomePage { 

    user: HomeUser[]; 

    constructor(public fb: FormBuilder,private homeService: HomeService) {} 


    public loginForm = this.fb.group({ 

     email: ["", Validators.required], 
     password: ["", Validators.required] 

    }); 

    doLogin(event) {  

     var user1 =this.loginForm.value; 
     //var password = this.loginForm.controls.password.value; 
     this.homeService.doLogin(user1).subscribe(user =>this.user = user); 

     //console.log(user); 

    } 
}

和我home.html的文件是： -

<form [formGroup]="loginForm" (ngSubmit)="doLogin($event)"> 
    <div class="row responsive-md"> 
    <div class="col col-50 col-offset-25"> 
     <div class="list"> 
     <label class="item item-input"> 
      <i class="fa fa-user fa-6" aria-hidden="true"></i> 
      &nbsp; &nbsp; 
      <input formControlName="email" type="email" placeholder="[email protected]"> 
     </label> 
     <label class="item item-input"> 
     <i class="fa fa-lock fa-6" aria-hidden="true"></i> 
     &nbsp; &nbsp; 
     <input formControlName="password" type="password" placeholder="***********"> 
     </label> 

     <button class="button button-block button-positive sign_in" type="submit" > 
     SIGN IN 
     </button> 

     <div class="signup"><span class="donaccount">Don't have an account ?</span> 
     <a href="javascript:;" class="achorsignup"> SIGN UP</a> 
    </div> 
    </div> 
</div> 
</div> 
</form>

我想，當禁用按鈕放式是無效的或空的我怎麼能離子2應用程序做的。

來源

2017-06-21 Shahzad Ditro

我想你需要的是你的表單中輸入的字段提供所需的屬性，所以直到字段的形式signInForm填無效。同樣，您也可以在輸入中提供其他驗證屬性。

實施例： -

<form name="signInForm"> 
    <input type="email" ng-model="email" name="email" required /> 

    <button class="btn btn-success" ng-click="register()" 
       ng-disabled="signInForm.$invalid">Register</button> 

</form>

來源

2017-06-21 12:18:02

它不適用於離子2 –

您可以在標記按鈕[disabled] =「！loginForm.valid」中使用此代碼 –

把一個「禁用」屬性附有以下條件。

<button type="button" [disabled]="!loginForm.valid">Save</button>

來源

2017-06-21 12:21:33

如何禁用按鈕時表單域是離子空或無效2

回答

相關問題