在两个不同的控制器AngularJS中使用相同的功能

时间:2014-02-12 10:10:04

标签: javascript angularjs controller

我试图在Angular JS中重用3个控制器上的一些更大的功能。我不想将函数固定到我的根作用域,因为我想要清除那些在这3个控制器中只使用3次的函数。

    angular.module('adminModule', ['adminDependency'])

        .controller('ctrl1', ['$scope', 'details', function ($scope, details) {
            // use functions
        }])

        .controller('ctrl2', ['$scope', 'details', function ($scope, details) {
            // use functions
        }])

        .controller('ctrl3', ['$scope', 'details', function ($scope, details) {
            // use functions
        }])

你能告诉我如何在不将我的功能写入根范围的情况下实现这一目标吗?

在工厂内尝试但是调用AdminModule.toLevelKey()不会工作......

    .factory('AdminModule',
        [ '$resource', 'serviceURL', function ($resource, serviceURL) {

            return $resource(serviceURL + 'class/:id', {
                    id : '@id'
                }, {
                    getClasses : {
                        method  : 'GET',
                        url     : serviceURL + 'extended/class',
                        isArray : true
                    },

                    toLevelKey : function (value) {
                        var return_key = parseInt(Math.floor(value / 3));
                        var return_level = value % 3;

                        return { level : return_level + 1, levelTranslationKey : return_key + 1 };
                    },

                    fromLevelKey : function (level, key) {
                        if (angular.isDefined(level)) {
                            var value = (key - 1) * 3 + (level - 1);

                            return value;
                        } else {
                            return null;
                        }
                    }
                }
            );
        } ]);

2 个答案:

答案 0 :(得分:10)

这可以通过服务来完成:

.service('myService', function(){
   return {
      fn: function(){
        // do what you want
      }
   }
});

用法:

.controller('ctrl2', ['$scope', 'details', 'myService', 
             function ($scope, details, myService) {
   // use functions
   myService.fn();
}])

答案 1 :(得分:3)

根据DavidFariña的上述评论:“还有更多选择吗?”

除了执行之外,您还可以将数据从一个控制器传递到另一个控制器并广播事件。

SharedService:

    angular.module("yourAppName", []).factory("mySharedService", function($rootScope){

        var mySharedService = {};

        mySharedService.values = {};

        mySharedService.setValues = function(params){
            mySharedService.values = params;
            $rootScope.$broadcast('dataPassed');
        }

        return mySharedService; 
   });

FirstController:

 function FirstCtrl($scope, mySharedService) {
      $scope.passDataInSharedSevice = function(params){
         mySharedService.setValues(params);
      }
 }

SecondController:

 function SecondController($scope, mySharedService) {
    $scope.$on('dataPassed', function () {
        $scope.newItems = mySharedService.values;
    });
 }