2014-11-21 3 views
0

this question과 비슷한 상황이 있습니다. 내 독특한 트위스트는 페이지가 초기 렌더링/바인딩을 완료 한 후 어떤 시점에서 비동기 적으로 (웹 서비스 호출을 통해) "동적"정보를 수신한다는 것입니다. 그래서, 내 지시어의 흐름은 다음과 같이이다 :AngularJS 양식 필드 유효성 검사 속성을 비동기 적으로 수정

** 업데이트 : 여기에 전체 생식 : http://plnkr.co/edit/TIVbhGFMAQpUaMxKp9Dc?p=info

Markup: <input dynValidate /> 
Directive: 

app.directive('dynValidate',function($compile,$parse) { 
     restrict: 'A', require: 'ngModel', replace: false, terminal: true, 
     link: function (scope, elem, attr, ctrl) { 
     var validatorKey = elem.attr('ng-model') + 'Validation'; 
     var installValidators = function() { 
       // ...add some ng-validation attributes  
       // (omitted for brevity, but does something like elem.attr('ng-minlength','5') 
       // based on metadata in the bound model 
       elem.removeAttr('dynValidate'); // Remove my own directive 
       $compile(elem)(scope); // recompile to incorporate new ng directives 
      } 
     }; 
     // watch for the validation metadata to arrive asynchronously 
     scope.$watch(validatorKey, function() { 
      installValidators(attr, ctrl); 
     }); 
     } 
    }); 

작품이-의 종류 : 내 지시 속성이 어떤 각도 검증 지침에 의해 대체되고 유효성 검사가 제대로 작동 이 요소의 레벨에서. 문제는 비동기식 재 컴파일이 상위 ng-form이 요소를 추적하지 못하게하는 것 같습니다. 특히 입력이 변경 될 때 form.fieldName. $ isDirty는 절대로 true로 설정되지 않습니다. 근본적으로 원래 요소를 제거하고 다른 요소로 대체했기 때문에 의미가 있습니다. 그러나 부모 형식으로이 사실을 알릴 수있는 메커니즘이 있는지 궁금합니다. $ error/$ dirty 메카니즘을 폼 레벨에서 사용한다.

감사합니다.

답변

0

<input>ngModel controller을 얻고 $addControl을 사용하여 양식의 ngForm controller에 등록하는 것이 좋습니다.

+0

흥미로운 아이디어는 지시어 내부에서 양식 컨트롤러를 얻을 수있는 방법일까요? – jlew

+0

'ngModel' 컨트롤러 (조상 요소에서 지시어 컨트롤러를 얻으려면 접두사 이름에'^'가 필요함)처럼 ([Require it] (https://docs.angularjs.org/api/ng/service/$compile)). – hon2a

+0

아, 멋지다. 필요하다.하지만 plunkr의 동작에 영향을 미치지 않는 것 같다. – jlew

관련 문제