有條件地添加一個類到動態生成的字段

Question

我正在使用ng-class指令進行某種驗證，但是在開始處理ng-repeat創建的元素時出現問題。

<div class="traveler" ng-repeat="i in getNumber(travelers_count) track by $index" style="margin-top: 15px"> 
         <div class="inp-wr wr-traveler"> 
          <input 
           ng-class="{ 'has-error' : valError && mainForm.last_name[{{$index + 1}}].$invalid}" 
           required 
           class="text-inp" 
           style="width: 200px" 
           ng-model="$parent.last_name[$index]" 
           ng-model-options="{ updateOn: 'blur' }" 
           ng-pattern="namePattern" 
           name="last_name[{{$index + 1}}]" 
           placeholder = "Last name"> 
         </div> 
</div> 

有沒有辦法讓這個工作？ ng-class="{ 'has-error' : valError && mainForm.last_name[{{$index + 1}}].$invalid}"

Answer 1

找到快速解決方案 - 需要來包裝<ng-form>輸入，並檢查它的有效性。 I.e

<div class="traveler" ng-repeat="i in getNumber(travelers_count) track by $index" style="margin-top: 15px"> 
          <div class="inp-wr wr-traveler"> 
<ng-form name="lastNameForm"> 
           <input 
            ng-class="{ 'has-error' : valError && lastNameForm.$invalid}" 
            required 
            class="text-inp" 
            style="width: 200px" 
            ng-model="$parent.last_name[$index]" 
            ng-model-options="{ updateOn: 'blur' }" 
            ng-pattern="namePattern" 
            name="last_name[{{$index + 1}}]" 
            placeholder = "Last name"> 
</ng-form> 
          </div> 
    </div> 

Answer 2

您不需要括號。

mainForm.last_name[$index + 1].$invalid