Angular - 僅在提交時驗證文本框

Question

是否存在一個ng-show表達式，我可以用它僅在單擊提交按鈕時驗證此文本框？目前，它在用戶輸入時顯示錯誤消息。

<div ng-show="!vm.validEmployerCode && !form.EmployerCode.$error.required" class="errorMessage"> 
      You have entered an invalid code 
</div> 

    <div class="row"> 
     <div class="col-xs-11"> 
      <div class="form-group"> 
       <label class="form-label" for="Code">Code</label> 
       <input ng-model="vm.code" name="Code" type="text" required id="Code" /> 
      </div> 
     </div> 
     <div class="btn-group" role="group" aria-label="..."> 
      <button type="submit" class="btn btn-success col-md-4"> 
       Sign Up 
      </button> 
     </div> 
    </div> 

Answer 1

你可以檢查$submitted標誌表單對象裏面，基本上，一旦你提交表格將成爲真正的。因此，您需要在ng-show指令中添加form.$submitted。

標記

<div ng-show="form.$submitted && !vm.validEmployerCode && !form.EmployerCode.$error.required" 
    class="errorMessage"> 
    You have entered an invalid code 
</div>