有条件地添加一个类到动态生成的字段

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