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()函数，edit()函数在我当前页面testController和最后{ {1}}函数写为copy()

请检查上面的代码。为什么不在我当前的页面控制器中调用anotherController anotherController函数？

抱歉我的英语不好:(

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");
     });   
   }  
 }

仅从$ child发起触发该事件

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

希望这会有所帮助。谢谢！

如何将AngularJS指令函数调用到另一个控制器？

1 个答案: