如何調用AngularJS指令函數到另一個控制器？

Question

custom.js

function config($stateProvider){
     $stateProvider
        .state('test_page', {
            abstract: true,
            url: "/test-page",
            controller: "testController"
            templateUrl: "test.html",
        });
}

function testController($scope){
     $scope.edit= function(){
          alert("You have clicked edit icon");
     }         
}

function anotherController($scope){
     $scope.copy = function(){
          alert("Holla... You have clicked copy icon");
     }
}



function iboxTools($timeout) {
    return {
        restrict: 'A',
        scope: true,
        templateUrl: 'views/common/ibox_tools.html',
        controller: function($scope, $element) {
            // Function for collapse ibox
            $scope.showhide = function() {
                var ibox = $element.closest('div.ibox');
                var icon = $element.find('i:first');
                var content = ibox.find('div.ibox-content');
                content.slideToggle(200);
                // Toggle icon from up to down
                icon.toggleClass('fa-chevron-up').toggleClass('fa-chevron-down');
                ibox.toggleClass('').toggleClass('border-bottom');
                $timeout(function() {
                    ibox.resize();
                    ibox.find('[id^=map-]').resize();
                }, 50);
            };
            // Function for close ibox
            $scope.closebox = function() {
                var ibox = $element.closest('div.ibox');
                ibox.remove();
            };
        }
    };
}



angular
        .module('myModule')
        .config(config)
        .controller('testController', testController)
        .controller('anotherController', anotherController)
        .directive('iboxTools', iboxTools)

test.html

<div ibox-tools></div>
/*more html */

ibox_tools.html

<div class="ibox-tools" uib-dropdown>
    <a ng-click="showhide()"> <i class="fa fa-chevron-up"></i></a>
    <a ng-click="copy()">
        <i class="fa fa-file"></i>
    </a>
    <a ng-click="edit()">
        <i class="fa fa-pencil"></i>
    </a>
    <a ng-click="closebox()"><i class="fa fa-times"></i></a>
</div>

以上，我已經發布了我的代碼。 這里的指令模板copy()函數不起作用，因為我已經在指令控制器中編寫了showhide()和closebox()函數，在當前頁面的testController編寫了edit()函數，最后編寫了anotherController copy()函數

請檢查我的代碼上方。 為什么不在當前頁面控制器中調用anotherController copy()函數？

對不起，我的英語不好 ：（

Answer 1

如果與指令/控制器無關，則不能簡單地在另一個控制器中調用該函數。 因此，為實現此目的，您可以將其聲明為$ rootScope函數而不是$ scope或使用事件。

 function testController($rootScope){
    $rootScope.edit= function(){
      alert("You have clicked edit icon");
    }         
 }

 function anotherController($rootScope){
    $rootScope.copy = function(){
      alert("Holla... You have clicked copy icon");
   }  
 }

每次都使用$ rootScope不好，但是在某些情況下您可以繼續進行。

或者我們可以使用事件

 function anotherController($rootScope){
     $scope.$on('copyEvent', function(event, arguments) {
        alert("Holla... You have clicked copy icon");
     });   
   }  
 }

僅從孩子$ emit觸發該事件

$scope.$emit('copyEvent', arguments);

希望這可以幫助。 謝謝 ！