驗證AngularJs中日期的輸入類型

Question

這是一個問題。

請注意，在required字段時不會出現此問題

我有一個輸入，其類型為日期，例如：

<label for="due-date">Due date</label>
<input
  type="date"
  name="dueDate"
  id="dueDate"
  ng-model="form.dueDate"
>
<div ng-if="myForm.dueDate.$touched && !myForm.dueDate.$valid" ng-messages="myForm.dueDate.$error">
  <p class="form-error-text" ng-show="myForm.dueDate.$error">
    Please set correct date (yyyy-mm-dd)
  </p>
</div>

視覺演示：

根據此ng-if="myForm.dueDate.$touched && !myForm.dueDate.$valid" ，檢查該字段是否有效，如果無效， Please set correct date (yyyy-mm-dd) 。 您可能會注意到，該字段不是必填字段。 這意味着默認情況下， myForm.dueDate.$valid為true 。

場景：

1. 未觸摸字段且日期有效（因為它不是必需的，並且默認為true）

   
   預期：按預期工作

2. 觸摸字段並且日期有效

   
   預期：按預期工作

3. 觸摸了字段並且日期無效
   預期：由於該字段無效，因此必須顯示錯誤消息

4. 觸摸字段，日期首先設置為/01/01/2015 ，然后更改為/01/mm/2015 （無效）

   
   預期：按預期工作

5. 觸摸字段，日期首先設置為/01/01/2015 ，然后更改為/dd/mm/yyyy （根據ng-if="myForm.dueDate.$touched && !myForm.dueDate.$valid聲明）

   
   預期的：因為該字段有效，所以沒有錯誤消息必須顯示

Answer 1

看來這是AngularJS v1.4.x的錯誤，清晰的解釋在此github PR中 。 @gkalpak已經提供了一種解決方案，但是PR處於里程碑狀態 ，可能需要一段時間才能解決。