중첩 된 지시문 내에서 팩토리 함수 사용

Question

중첩 된 지시문에서 팩토리 함수를 사용하는 데 문제가 있습니다.

주 코드는 컨트롤러에서 테스트 되었기 때문에 작동합니다. 모든 자바 스크립트 파일은 처음에로드됩니다. 그때는 작업 지침을 호출하는 작업 목록 지침을 호출 경로를 사용하여 todoController.js에 액세스

:

이

는 시나리오입니다.

(function(angular) { 
    gameOnApp.directive('modalButton', function($compile) { 
     return { 
      restrict: 'A', 
      priority: 1001, 
      terminal: true, 
      compile: function(elm, attrs) { 
       elm.attr('ng-click', "modal.openModal('" + attrs.modalId + "')"); 

       elm.removeAttr('modal-button'); 
       elm.removeAttr('modal-id'); 

       var fn = $compile(elm); 
       return function(scope){ 
        scope.modal = Modal; 
        fn(scope); 
       }; 
      } 
     } 
    }); 

    gameOnApp.factory('Modal', function(){ 
     return { 
      openModal: function(modalId) { 
       console.log(modalId); 
      } 
     } 
    }); 
})(window.angular); 

그리고 내 HTML에

내가 같이 호출 :이 코드 ( modalService.js)를 구현하기 위해 노력하고있어

<li> 
    <span modal-button modal-id="12"><i class="fa fa-edit fa-fw"></i> Edit</span> 
</li> 

는 HTML 응답은 다음과 같습니다

<li> 
    <span ng-click="modal.openModal('12')"><i class="fa fa-edit fa-fw"></i> Edit</span> 
</li> 

그리고 작업 Directi

gameOnApp.directive('task', function($compile, Modal) { 
    return { 
     restrict: 'E', 
     scope: false, 
     templateUrl: 'app/components/todo/taskView.html', 
     compile: function(elm, attrs){ 
      return function(scope){ 
       scope.modal = Modal; 
      } 
     } 
    }; 
}); 

그리고 작업 지침이 모달 지침에서 NG 클릭 기능을 인식하지 않기 때문에이 작동하지 않는 것을 알고 : 모달 코드했습니다.

어떻게 해결할 수 있습니까?

Answer 1

저는 AngularJS 방법을 사용하여 문제를 해결했습니다. 다시 쓰기

modalService.js에 : 그것은 항상 거기에있는 것처럼

(function(angular) { 
    gameOnApp.directive('modalButton', function($compile, Modal) { 
     return { 
      restrict: 'A', 
      priority: 1001, 
      terminal: true, 
      compile: function compile(elm, attrs, transclude) { 
       return function postLink(scope, iElement, iAttrs, controller) { 
        iElement.attr('ng-click', "modal.openModal('" + attrs.modalId + "')"); 

        iElement.removeAttr('modal-button'); 
        iElement.removeAttr('modal-id'); 

        scope.modal = Modal; 

        var fn = $compile(iElement); 
        fn(scope); 
       } 
      } 
     } 
    }); 

    gameOnApp.factory('Modal', function(){ 
     return { 
      openModal: function(modalId) { 
       console.log(modalId); 
      } 
     } 
    }); 
})(window.angular); 

이 및 POSTLINK, 그것은이 NG 클릭 속성을 유지 컴파일 기능을 사용.

gameOnApp.directive('task', function($scope) { 
    return { 
     restrict: 'E', 
     templateUrl: 'app/components/todo/taskView.html' 
    }; 
}); 

:

은 그리고, 난 그냥 내 작업 서비스를 청소하기 위해 필요한