我的 AngularJS 验证不起作用。我已经添加了 ng-required

Question

我的 AngularJS 验证不起作用。我已经添加了 ng-required。请让我知道我失踪的地方

<ng-form id="frmdisbursementScheduleMaintenance">
            <div style="padding-bottom: 8px;">
                <button id="cm-SaveBtn" name="cm-SaveBtn" type="button" ng-click="submitted=true">Save</button>
                <button id="cm-RefreshBtn" name="cm-RefreshBtn" type="button">Refresh</button>
            </div>
          <div>
                    <table>

                        <tr>
                            <td><span class="VNAVLabel">Process Begin Date: </span></td>
                            <td> 
                                <span><input type="date" name="processBeginDate" ng-model="processBeginDate" required></span>
                                <span ng-show="(frmdisbursementScheduleMaintenance.processBeginDate.$dirty || submitted) && frmdisbursementScheduleMaintenance.processBeginDate.$error.required">
                                    Process Begin Date is required
                                </span>
                            </td>
                        </tr>

                    </table>
                </div>

</ng-form>

Answer 1

不应该是 id，您应该使用 name 属性。 Angular 将创建名称为 frmdisbursementScheduleMaintenance 的 $scope 变量，其中将包含表单信息。

<ng-form name="frmdisbursementScheduleMaintenance">

Answer 2

对表单元素使用 'name' 而不是 'id'。

此外，您不必检查 (frmdisbursementScheduleMaintenance.processBeginDate.$dirty || submitted) 只有 frmdisbursementScheduleMaintenance.processBeginDate.$error.required 可以完成这项工作。

<ng-form name="frmdisbursementScheduleMaintenance">
   <div style="padding-bottom: 8px;">
      <button id="cm-SaveBtn" name="cm-SaveBtn" type="button" ng-click="submitted=true">Save</button>
      <button id="cm-RefreshBtn" name="cm-RefreshBtn" type="button">Refresh</button>
   </div>
   <div>
      <table>
         <tr>
            <td><span class="VNAVLabel">Process Begin Date: </span></td>
            <td> 
               <span><input type="date" name="processBeginDate" ng-model="processBeginDate" required></span>
               <span ng-show="frmdisbursementScheduleMaintenance.processBeginDate.$error.required">
               Process Begin Date is required
               </span>
            </td>
         </tr>
      </table>
   </div>
</ng-form>

我的 AngularJS 验证不起作用。我已经添加了 ng-required

My AngularJS validation does not work. I have added ng-required

forms

validation

angularjs

angularjs-forms