服务与控制器vs外部js把经常使用的方法在angularjs

我有一个angularjs应用程序，其中有几个控制器与几个视图。当我开始编写应用程序时，几乎没有方法（类似类型），这些方法在多个地方使用，最初对于将这些方法放在需要的地方（两个或三个控制器）来说，最初看起来还不错。但随着我的应用程序的增长，我开始注意到代码冗余问题，因为这个方法在更多地方需要。肯定这是我缺乏经验导致这个问题。服务与控制器vs外部js把经常使用的方法在angularjs

现在我决定从我的应用程序中删除这个冗余代码。我发现下面的选项：

服务方式：删除冗余代码，并把它放在一个新的服务，包括服务，我需要的功能的所有地方。
External JS：将冗余代码放在外部js文件中，并调用所需的方法。
请保持原样。

但在这里我想提一提，我说的冗余代码不是很紧耦合，并且可以添加，并用很少的努力去除任何地方。

现在，我想知道的是从上述选项中，我应该选择哪一个？或是否有更好的选择可用于这个问题（可能由angularJS本身提供）。

编辑的代码基本的例子：正如我所说

$scope.showSomething = function (show, ele) { 
    //show or hide the ele (element) based on value of show 
}

来源

2014-12-08 me_digvijay

这取决于重复代码*是什么*。你能提供一个例子吗？ – 2014-12-08 09:06:46

@DavinTryon：提供样本代码 – 2014-12-08 09:12:31

您正在使用的角度肯定使你想使按照MVC你的应用程序结构。如果您的代码放在任何地方的任何js文件中，您的应用将遵循什么样的MVC模式。我会建议把你的代码放入一个服务中。这是减少冗余的角度。您还有另一个选项来设置功能$rootscopehere

来源

2014-12-08 09:15:56

我不确定你的情况，但我有类似的情况：我有一些功能提供验证功能。我创建的服务：

'use strict'; 


angular.module('myApp') 
    .factory('UtilService', ['Env', 'IBANChecker', function(Env, IBANChecker) { 

var validateCallbacks = { 
     checkAddress: function (address) { 
     return address.action != 'delete'; 
     }, 
     validateIBAN: function (iban) { 
     return !iban || IBANChecker.isValid(iban); 
     }, 
..... 
     validateYCode: function(id) { 
     return YCodeChecker.isValid(id); 
     } 
    }; 

    return { 
     /** 
     * Factory with callbacks for 'validate' directive. 
     * 0 arguments -- get all callbacks, over wise see @validateCallbacks object to get specific callbacks. 
     * if wrong callback name requested -> it will be ignored 
     * @returns {object} -- call requested callbacks. 
     */ 
     getValidateCallbacks : function() { 
     if(arguments.length) { 
      var result = {}; 
      _.each(arguments, function(argument){ 
      if(validateCallbacks[argument]) { 
       result[argument] = validateCallbacks[argument]; 
      } 
      }); 
      return result; 
     } else { 
      return validateCallbacks; 
     } 
     } 
    }; 

    }]);

和代码在控制器的样子：

 var validateCallbacks = UtilService.getValidateCallbacks('validateText', 'validateNumber'); 

     _.each(validateCallbacks, function(callback, key) { 
     $scope[key] = callback; 
     });

来源

2014-12-08 09:16:17 Rasalom

我倾向于使用的工厂，特别是因为工厂可以依赖于其他工厂，可以定义逻辑模块。考虑下面的伪代码。

.controller('HisController', function (UtilityService) { 
    $scope.foo = UtilityService.foo; 
}) 
.controller('HerController', function (UtilityService) { 
    $scope.foo = UtilityService.foo; 
}) 
.factory('UtilityService', function (SomeOtherService) { 
    var service = { 
     foo: foo, 
     bar: bar, 
    } 
    return service 
    /////// 
    function foo(a) { 
     return a.substring(0,1); 
    } 
    function bar(a) { 
     return SomeOtherService.doStuff(service.foo(a)); 
    } 
})

来源

2014-12-08 09:17:11

那些投下了答案的人需要时间来解释他们的投票吗？ – redben 2015-05-03 19:22:56

服务与控制器vs外部js把经常使用的方法在angularjs

回答

相关问题