폼 검증 Jhipster와

Question

내 JHipster 발생기 버전입니다 : 내 양식 유효성 검사 show-validation을 사용하고 generator-jhipster 2.27.1

. 다음 시나리오를 제외하고 모든 것이 올바르게 작동하는 것 같습니다.

1. 텍스트 필드가 required 인 것으로 가정합니다.
2. 한 글자를 입력하면 필드가 유효하게됩니다.
3. 텍스트를 삭제하면 필드가 잘못됨 오류 메시지가 나타나고 입력 용 양식 그룹이 빨간색으로 바뀝니다.
4. 이제 텍스트를 다시 입력하십시오. 필드가 유효 해지고 오류 메시지가 사라지지만 양식 그룹의 has-error 클래스가 아직 제거되지 않았습니다. 양식 그룹은 여전히 ​​빨간색으로 유지됩니다.
5. 두 번째 문자를 입력하면 has-error이 제거됩니다.

이 양식 유효성 검사 지침을 즉시 업데이트되지 form.directive.js

$inputs.each(function() { 
    var $input = $(this); 
    scope.$watch(function() {        
     return $input.hasClass('ng-invalid') && $input.hasClass('ng-dirty'); 
    }, function(isInvalid) { 
     $formGroup.toggleClass('has-error', isInvalid); 
    }); 
} 

에서 관련 코드입니다하지만 하나의 입력 변화에 의해 뒤에이다. 나는 코드의 어느 부분을 수정해야 하는지를 알 수 없다.

콘솔 로그를 추가했지만 사용할 수 없습니다. 나는 그것이 모델 값에 대한 텍스트 값과 관련이 있다고 가정하지만 그것을 고치는 방법을 모른다.

Answer 1

어때?

: -

  link: function (scope, element, attrs, formCtrl) { 
      element.find('.form-group').each(function() { 
       var $formGroup = $(this); 
       var $inputs = $formGroup.find('input[ng-model],textarea[ng-model],select[ng-model]'); 

       if ($inputs.length > 0) { 
        $inputs.each(function() { 
         var $input = $(this); 
         scope.$watch(function() { 
          //inputs need to have 'name' attribute for this to work 
          return formCtrl[$input[0].name].$invalid; 
          //&& formCtrl[$input[0].name].$dirty; 
         }, function(isInvalid) { 
          $formGroup.toggleClass('has-error', isInvalid); 
         }); 
        }); 
       } 
      }); 
     } 

(추가 필요한 경우 주석 더러운 검사 formCtrl ATTR 링크 기능과 바인드합니다은 $ watch.function 변경)