如何在Angularjs中驗證元素的副本並顯示錯誤消息

我有一個表單，其中動態生成多個相同的元素。在提交表單時，我需要驗證此表單元素並顯示錯誤消息。錯誤消息顯示用下面的代碼說，例如：如何在Angularjs中驗證元素的副本並顯示錯誤消息

<span class="error input-icon fui-alert" ng-show="historyForm.edutoDate0.$error.beforeDate"></span>

edutoDate輸入元件與IDS edutoDate0，edutoDate1 .... 但錯誤消息不是showing.On除去該索引值0動態生成的， 1,2 ...它會工作。請幫助我找到解決方案。

來源

2014-02-25 Vishnupriya

您可以嘗試將此示例轉換爲[plnkr]（http://plnkr.co/）或[jsfiddle]（http://jsfiddle.net/），以便我們幫助您進行調試。有多種原因可能無法正常工作。我的猜測是'historyForm.edutoDate0。$ error.beforeDate'未定義或者是一個錯誤的參考。 angular的表單模型從輸入元素上的name屬性獲取它的字段名稱，而不是ID。嘗試確認是否存在edutoDate0。如果它們全都具有相同的ID或名稱，則它很可能是一個數組。 –

試試這個代碼，而不是你的代碼

ng-show="historyForm.edutoDate[0].$error.beforeDate"> 
ng-show="historyForm.edutoDate[1].$error.beforeDate"> 
ng-show="historyForm.edutoDate[2].$error.beforeDate">

來源

2014-02-25 05:18:12

我用NG-形式的指令，並解決了issue.My代碼如下圖所示。

<span ng-repeat="experience in userExperience"> 
        <ng-form name="historyExpForm"> 
        <div class="row"> 
         <a ng-click="deleteExperience(experience)" data-action="close" class="delete"> 
          <i class="glyphicon glyphicon-remove"></i> 
         </a> 
         <div class="col-xs-6 col-sm-6 col-6"> 
          <label>Position</label> 
          <input type="text" class="form-control" ng-model="experience.title"/> 
         </div> 
         <div class="col-xs-6 col-sm-6 col-6"> 
          <label>Organisation/Company</label> 
          <input type="text" class="form-control" ng-model="experience.organization"/> 
         </div> 
        </div> 
        <div class="row"> 
         <div class="col-xs-6 col-sm-6 col-6"> 
          <label>From date</label> 
          <input type="text" name="expFromDate" class="form-control" ng-model="experience.fromDate" ui-date /> 
         </div> 
         <div class="col-xs-6 col-sm-6 col-6"> 
          <label>To date</label> 
          <div class="form-group has-success"> 
           <input type="text" name="expToDate" class="form-control" ng-model="experience.toDate" ui-date before-date="{{experience.fromDate | date:'dd MMM, y hh:mm a'}}"/> 
           <span class="error input-icon fui-alert" ng-show="historyExpForm.expToDate.$error.beforeDate"></span> 
          </div> 
         </div> 
        </div> 
        <hr class="separator"/> 
       </ng-form> 
       </span>

beforeDate指令將驗證每個子窗體並正確顯示錯誤消息。

來源

2014-02-25 12:56:22 Vishnupriya

如何在Angularjs中驗證元素的副本並顯示錯誤消息

回答

相關問題