AngularJS 지시문의 컴파일 함수가 ng-if 내부에 지시문이있는 경우 실행되지 않음

Question

내 AngualrJS (1.x) 응용 프로그램에 텍스트 상자 유효성 검사를 수행 할 사용자 지정 지시문이 있습니다. 지시문은 요소로 사용해야합니다. 유효성을 검사해야하는 텍스트 상자는 지시문 요소 내부에 있어야합니다. 이 지시자에는 유효성 확인 논리가있는 컴파일 함수가 있습니다.

지시문이 제대로 작동합니다. 하지만 라디오 버튼 클릭에 따라 텍스트 상자를 표시하거나 숨길 필요가있는 시나리오가 있습니다. 이를 위해 ng-if 내부 지시문을 유지하려고 시도했지만 지시문이 ng-if 내부에 있으면 컴파일 기능이 트리거되지 않습니다. 나는 링크 기능에 로직을 유지하려했지만 링크 기능도 트리거되지 않았다. 측면 ng-show에 지시문을 보관할 수 없습니다. 왜냐하면 숨겨진 시나리오 중에도 필수 필드 유효성 검사가 여전히 활성화되어 있으며 ng-required에 조건을 사용하고 싶지 않기 때문입니다.

ng-if에서 내 지시어를 실행할 수있는 방법이 있습니까? 나는 왜 그것이 실행되지 않을지 모르겠다. 어떤 도움을 주시면 감사하겠습니다.

Answer 1

ng-if 및 ng-show 모두는 DOM 요소를 표시/숨기기 위해 사용되지만 그들 사이에 큰 차이는 ng-if="expression"이 요소를 제거한다는 것이다 (물론이 모든 자식의)을 expression이 false로 평가되는 경우 DOM에서.

ng-show="expression"은 .ng-hide 클래스 (display: none을 추가)를 기준으로 요소를 숨 깁니다.

따라서 ng-if을 사용하고 ng-if의 우선 순위가 높기 때문에 표현식이 false로 평가되면 다른 지시문이 실행되거나 컴파일되지 않습니다. 이것이 사용자 지정 지시문이 실행되지 않는 이유입니다.

ng-if 대신 ng-show을 사용하십시오.

편집 : 난 그냥

질문을 다시 읽고 당신이 할 수있는 것을 알게되지 당신이 필요하기 때문에 현장 검증 ng-show. 나는 그것을위한 해결책도 가지고있다. 이것은 해당 필드가 필요한 당신의 체크 박스를 체크 표시합니다 경우

ng-required="sameExpressionAsInNgShow" 

:

대신 사용 required의 ng-required과 같은 당신이 (ng-if에서 현재) ng-show에서 사용할 같은 표현을 사용합니다.