如何禁用按钮时表单域是离子空或无效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

回答

相关问题