Javascript 防止angularJS/ionic中隐藏字段的验证

Javascript 防止angularJS/ionic中隐藏字段的验证,javascript,angularjs,forms,validation,ionic-framework,Javascript,Angularjs,Forms,Validation,Ionic Framework,我有这个表单,当满足某些要求时,我使用ng hide来隐藏一些字段。我已经对所有字段使用了验证(当一个字段保持为空时,它将验证并要求填充该字段)。问题是当我的字段被隐藏时,它似乎仍然在验证。所以我不能继续我的表格。我怎样才能解决这个问题 我对隐藏的字段使用了ng required,并在不需要该字段时将其设置为false,但它似乎不起作用 这是我所指表格的一部分: <div class="form-group" ng-class="{ 'has-error' :submitted &

我有这个表单,当满足某些要求时,我使用ng hide来隐藏一些字段。我已经对所有字段使用了验证(当一个字段保持为空时,它将验证并要求填充该字段)。问题是当我的字段被隐藏时,它似乎仍然在验证。所以我不能继续我的表格。我怎样才能解决这个问题

我对隐藏的字段使用了ng required,并在不需要该字段时将其设置为false,但它似乎不起作用

这是我所指表格的一部分:

<div class="form-group" ng-class="{ 'has-error' :submitted && (myForm.scheduler.$pristine || myForm.scheduler.$invalid)}">
                                   <label class="labelColor"><h5><b>Payment Type *</b></h5></label>
                                   <select  type="select" class="textbox-n"  id="scheduler" ng-model="data.scheduler" ng-change="scheduleChange()"  ng-options="Scheduler.name for Scheduler in SchedulersArr" name="scheduler" required>

                                       <option id="default" value="" selected="selected">--Select--</option></select>
                                   <span class="help-inline" ng-show="submitted && (myForm.scheduler.$pristine || myForm.scheduler.$invalid)" >A Payment Type is required.</span>
                               </div>

                               <!-- Effective Date:-->
                               <div ng-hide = "hideFutureDate">
                                   <div class="form-group" ng-class="{ 'has-error' : myForm.effectiveDate.$invalid && myForm.effectiveDate.$dirty && submitted || (myForm.effectiveDate.$invalid && myForm.effectiveDate.$pristine) && submitted }">
                                       <label class="labelColor" ><h5><b>Effective Date*</b></h5></label><br>
                                       <input style="width:100%" class="item-input-wrapper" type="date"  id="effectiveDate" name="effectiveDate" ng-model="data.effectiveDate"
                                       placeholder="Effective Date" ng-required="!hideFutureDate" />
                                       &nbsp;
                                       <span class="help-inline" ng-show="submitted && myForm.startDate.$error.required"  >A Effective date is required.</span>
                                       <font color="red" >{{dateValidation}}</font>

                                   </div>
                               </div>


                               <!--From/To Dates -->
                               <div ng-hide = "hideRecurrent" >
                                   <div class="row" style="padding-left:15px">
                                       <div class="form-group" ng-class="{ 'has-error' : myForm.startDate.$invalid && myForm.startDate.$dirty && submitted || (myForm.startDate.$invalid && myForm.startDate.$pristine) && submitted }">
                                           <label class="labelColor" ><h5><b>From Date*</b></h5></label><br>
                                           <input style="width:100%" class="item-input-wrapper" type="date"  id="startDate" name="startDate" ng-model="data.startDate"
                                           placeholder="From Date" ng-required="!hideRecurrent" />
                                           &nbsp;
                                           <span class="help-inline" ng-show="submitted && myForm.startDate.$error.required"  >A Start date is required.</span>
                                           <font color="red" >{{dateValidation}}</font>

                                       </div>
                                       &nbsp;&nbsp;&nbsp;
                                       <div class="form-group" ng-class="{ 'has-error' : myForm.toDate.$invalid && myForm.toDate.$dirty && submitted || (myForm.toDate.$invalid && myForm.toDate.$pristine) && submitted }">
                                           <label class="labelColor" ><h5><b>To Date*</b></h5></label><br>
                                           <input style="width:100%" class="item-input-wrapper" type="date" id="toDate" name="toDate" ng-model="data.toDate"
                                           placeholder="To Date" ng-required="!hideRecurrent" />
                                           <span class="help-inline" ng-show="submitted && myForm.toDate.$error.required" >An End date is required.</span>
                                           <font color="red" >{{dateValidation}}</font>
                                       </div>

                                       &nbsp;
                                   </div>

我知道我可以使用ng if来解决这个问题,但不确定如何解决。

您确实可以使用
ng if来解决这个问题。假设您的后端实际上可以处理诸如
data.startDate
之类的空白输入,那么您可以执行以下操作:

<input ... ng-if="!hideRecurrent" />


当不满足条件时,
ng if
实际上会将其从页面中删除,而不是显示/隐藏输入。页面上没有输入意味着没有验证错误。

您确实可以使用
ng if
来解决此问题。假设您的后端实际上可以处理诸如
data.startDate
之类的空白输入,那么您可以执行以下操作:

<input ... ng-if="!hideRecurrent" />


当不满足条件时,
ng if
实际上会将其从页面中删除,而不是显示/隐藏输入。页面上没有输入意味着没有验证错误。

一旦它删除,当条件不满足时我可以取回它吗?一旦它删除,当条件不满足时我可以取回它吗?