Angular2表演元素，如果没有特定的元素可见

Question

HTML：

<form> 
    <div class="row"> 
    <div class="col"> 
     <div class="form-group"> 
     <label for="registerFormEmail">Email Address</label> 
     <input type="text" class="form-control" placeholder="Enter your email address..." 
       [(ngModel)]="registerEmail" name="field" #email="ngModel" email> 
     <p *ngIf="email.errors?.email">Invalid Email</p> 
     </div> 
    </div> 
    <div class="col"></div> 
    </div> 

    <div class="row"> 
    <div class="col"> 
     <div class="form-group"> 
     <label for="registerFormBattletag">Battletag</label> 
     <input type="text" class="form-control" placeholder="Enter your Battletag..." 
       [(ngModel)]="registerBattletag" name="registerFormBattletag" ngControl=”battletag” #btag="ngModel" pattern="[a-zA-Z]+[#][0-9]{4}$"> 
     <p *ngIf="btag.errors?.pattern">Invalid Battletag</p> 
     </div> 
    </div> 
    <div class="col"></div> 
    </div> 

    <div class="row"> 
    <div class="col"> 
     <div class="form-group"> 
     <label for="registerFormPassword">Password</label> 
     <input type="password" class="form-control" placeholder="Enter your password..." 
       [(ngModel)]="registerPassword" name="registerFormPassword" #password="ngModel" [minlength]="6"> 
     <p *ngIf="password.errors?.minlength">Invalid Password</p> 
     </div> 
    </div> 
    <div class="col"> 
     <div class="form-group"> 
     <label for="registerFormConfirmPassword">Confirm Password</label> 
     <input type="password" class="form-control" placeholder="Confirm your password..." 
       [(ngModel)]="registerConfirmPassword" name="registerFormConfirmPassword" #confirmPassword="ngModel" [equalTo]="password"> 
     <p *ngIf="confirmPassword.errors?.equalTo">equalTo error</p> 
     </div> 
    </div> 
    </div> 

    <button type="submit" class="btn btn-primary" 
      (click)="register(registerEmail, registerPassword)">Register</button> 
</form> 

我已经<p>元素显示出来，如果<input>的不验证。我需要禁用提交按钮，如果这些<p>元素中的一个或多个可见（不知道如何完成表单验证）。如果所有验证都通过了，那么启用提交按钮的最佳方法是什么？如果一个或多个验证失败，那么将其禁用为禁用？

Answer 1

在按钮元素中使用禁用。

<button type="submit" [disabled]="btag.errors?.pattern || btag.errors?.pattern || password.errors?.minlength || confirmPassword.errors?.equalTo" class="btn btn-primary" 
 
      (click)="register(registerEmail, registerPassword)">Register</button>