Угловая пользовательская форма проверки $ ошибка не работает

Question

Это одна из тех ошибок, из-за которой вы разрываете волосы.

Я написал директиву для выполнения пользовательской проверки на время, расстояние или количество баллов в соответствии со значением, выбранным в поле выбора. Здесь он работает хорошо:

http://plnkr.co/edit/FECdILYtahR0HjoWysTr?p=preview

Проблема начинается, когда я применяю директиву к моему заявлению. Недопустимое свойство $ form имеет значение true, но $ error.mymeasure, хотя, по-видимому, установлено в true в отладчике, не оказывает никакого влияния на представление.

скриншот вывода отладчика Chrome: http://prntscr.com/2peomt

Код для вывода $ ошибок и $ недействительные свойства:

entriesForm.savedcurvalue.$error.mymeasure: {{ entriesForm.savedcurvalue.$error.mymeasure }} 
/$invalid: {{ entriesForm.$invalid }} <br/> 

Фактический выход в виде:

entriesForm.savedcurvalue.$error.mymeasure:/$invalid: true

Насколько Я могу сказать, что соответствующий код идентичен тесту ... вот html: (Вход с директивой находится в дно)

<form name="entriesForm" class="css-form" novalidate> 
<div class="grey-border" ng-show="entriesData.currentAthleteIndex != undefined"> 

<!--******** ALREADY SAVED ********--> 
<div ng-show="entriesData.showEventListGroup=='saved'"> 
    <ul class="inline entry-table-head"> 
     <li class="entry-col-1">{{ 'entries.class' | i18n }}</li> 
     <li class="entry-col-2">{{ 'entries.event.curValue' | i18n }}</li> 
     <li class="entry-col-3">{{ 'entries.event.curWeightHeight' | i18n }}</li> 
     <li class="entry-col-4">{{ 'entries.event.datDate' | i18n }}</li> 
     <li class="entry-col-5">{{ 'entries.event.strTown' | i18n }}</li> 
     <li class="entry-col-6">{{ 'entries.event.bolindoor' | i18n }}</li> 
    </ul> 
    <span ng-show="entriesForm.measurement.$error.measure">{{ measurementFormat }} </span> 
    entriesForm.savedcurvalue.$error.mymeasure: {{ entriesForm.savedcurvalue.$error.mymeasure }}/$invalid: {{ entriesForm.$invalid }} <br/> 
    <ul class="unstyled"> 
     <li ng-repeat="event in currentEditItem.athleteList[entriesData.currentAthleteIndex].events" 
      ng-show="event.selected && !event.isRelay"> 

      <ul class="inline"> 
       <li class="entry-col-1" 
        ng-class="{requestStatusGreen:event.ownEvents && event.ownSex, requestStatusYellow:!event.ownEvents && event.ownSex, requestStatusRed:!event.ownEvents && !event.ownSex}"> 
        <label class="checkbox inline"> 
         <input type="checkbox" ng-model="event.selected" ng-click="setIntStateSave(event,currentEditItem.athleteList[entriesData.currentAthleteIndex])"/> 
         {{ event.strIdClass }} - {{ event.strName }} 
        </label> 
       </li> 
       <li class="entry-col-2 control-group" ng-class="{error:entriesForm.saved_curValue.$error.measure}"> 
        <input class="input-mini" type="text" ng-model="event.curValue" ng-change="setChecked(event)" name="savedcurvalue" 
          smart-measurement="event.intType" errorformat="measurementFormat" decimal="DECIMAL" /> 
       </li> 

И директива:

app.directive('smartMeasurement', function() { 
    return { 
     require: 'ngModel', 
     scope: { 
      ngModel: '=', 
      smartMeasurement: '=', 
      errorformat: '=', 
      decimal: '=' 
     }, 
     link: function (scope, elm, attrs, ctrl) { 
      var REGEX; 
      var TIME_REGEXP; 
      var LENGTH_REGEXP; 
      var MULTI_REGEXP = /^(?:\d{1,5})?$/; 

      if (scope.decimal == ",") { 
       TIME_REGEXP = /^(?:\d+:)?(?:[0-5]\d:|[0-9]:)?(?:[0-5]\d|\d|^\d\d\d)(?:[.,]\d\d?)?$/; 
       LENGTH_REGEXP = /^(?:\d{1,3})(?:[,]\d)(\d)?$/; 
      } else { 
       TIME_REGEXP = /^(?:\d+:)?(?:[0-5]\d:|[0-9]:)?(?:[0-5]\d|\d|^\d\d\d)(?:[.,]\d\d?)?$/; 
       LENGTH_REGEXP = /^(?:\d{1,3})(?:[.]\d)(\d)?$/; 
      } 

      ctrl.$parsers.unshift(function (viewValue) { 
       switch (scope.smartMeasurement) { 
        case 3: 
         REGEX = LENGTH_REGEXP; 
         scope.errorformat = "00" + scope.decimal + "00"; 
         break; 
        case 4: 
         REGEX = MULTI_REGEXP; 
         scope.errorformat = "00000"; 
         break; 
        default: 
         REGEX = TIME_REGEXP; 
         scope.errorformat = "[hh:mm:]ss" + scope.decimal + "t[h]/[s]ss" + scope.decimal + "t[h]"; 
         break; 
       } 
       if (REGEX.test(viewValue)) { 
        ctrl.$setValidity('mymeasure', true); 
        return viewValue; 
       } else { 
        ctrl.$setValidity('mymeasure', false); 
        return undefined; 
       } 
      }); 
     } 
    }; 
}); 

Я использую Угловое 1,06 - Проект был начат почти год назад, так что обновление до 1.2 не вариант на данный момент. Я думаю, что, возможно, одна из зависимостей может помешать ей работать. Я проверю это, хотя считаю это маловероятным. Но это единственное, о чем я могу думать, что это может быть неправильно.

Если кто-нибудь может поспорить с ошибкой или предложить место, которое я должен посмотреть, он был бы очень признателен.

Answer 1

ОК, я нашел проблему. У меня есть поля формы в цикле, что означает, что поле имени нечеткое.

Ответ добавить ng-form на каждой итерации цикла, а затем проверить состояние ошибки каждого поля этой формы ...

<form name="form" class="form-horizontal" novalidate> 
    form.measurement.$error.measure: {{ form.measurement.$error.measure }} <br/> 

    <div class="alert alert-error" ng-show="form.measurement.$error.measure"> 
     {{ measurementFormat }} 
    </div> 
    <ul class="unstyled"> 
     <li class='control-group' ng-class="{error:form.measurement.$error.measure}" ng-repeat="l in loop"> 
      <ng-form name="loopForm"> 
       loopForm.measurement.$error.measure: {{ loopForm.measurement.$error.measure }} <br/> 
       <input class="input-mini error" type="text" ng-model="measurement" ng-change="setChecked()" 
         name="measurement" smart-measurement=selectedFormat errorformat="measurementFormat" decimal="DECIMAL"/> 
       {{measurement}} 
      </ng-form> 
     </li> 
    </ul> 
</form> 

Я надеюсь, что это поможет кому-нибудь :-)