다른 컨트롤러의 범위 기능에서 사용자 지정 지시문을 호출하는 방법

Question

AngularJS를 처음 사용합니다. 아무도 다른 컨트롤러의 범위 함수에서 사용자 지정 지시문을 호출하는 방법을 예로들 수 있습니다.

var showModalDirective = function ($timeout) { 
    return { 
     restrict: 'E', 
     templateUrl: '/Partials/template1.html', 
    }; 
}; 
angularApp.directive('showModal', showModalDirective); 

그래서 어떻게 showReport 기능이 지시어를 호출하는 방법을 다음과 같이

angularApp.controller('sample_Ctrl', function ($scope, $http, $timeout, $rootScope, $location) { 
    $scope.showReport = function(id) { 
    }; 
}); 

가 나는 customDirective을 만들어 다음과 같이

예를 들어 나는 기능을 가진 컨트롤러가 템플릿 URL에 ID를 전달할 수 있습니까?

Answer 1

controller에 directive을 호출 할 수 없습니다. service이어야합니다.

또는 당신은보기에 지시어를 사용할 수 있습니다

지침 :

var showModalDirective = function ($timeout) { 
    return { 
     restrict: 'E', 
     scope: { 
      modalId: '=' 
     }, 
     templateUrl: '/Partials/template1.html', 
    }; 
}; 

angularApp.directive('showModal', showModalDirective); 

컨트롤러 :

angularApp.controller('sample_Ctrl', function ($scope, $http, $timeout, $rootScope, $location) { 

    $scope.showModal = false; 

    $scope.showReport = function(id) { 
    $scope.showModal = true; 
    $scope.modalId = id; 
    }; 
}); 

보기 :

<div ng-if="showModal"> 
    <show-modal modal-id="modalId"></show-modal> 
</div> 

showModal 지시문은 변수가 true 일 때 호출됩니다.

Answer 2

지시문을 사용하려면 지시문과 동일한 이름의 HTML 요소를 만든 다음 컨트롤러에서 해당 지시문에 대한 데이터를 제공해야합니다. html 페이지에 div가 있다고 가정합니다.

<div show-modal> </div> 

그런 다음이 페이지에서 template1.html 지시문을 통해 내부적으로 호출하고 귀하의 질문이 명확하지 않다

code in your controller - 
angularApp.controller('sample_Ctrl',function() { 
    $scope.firstName= "My First Name" 
})