如何在AngularJS工厂中重用函数？

Question

我有一个AngularJS工厂用于一些常见的本地存储操作。这是针对不同变量的一组常用功能。我正在构建它，以便根据需要操作哪个变量来重复功能。可能不是一个优雅的方式去这个开放的选项。

工厂看起来如下。有没有办法根据变量重用函数，而没有太多的代码膨胀？

angular.module('app.datastore', []) 

    .factory('DataStore', function() { 

    var venue = angular.fromJson(window.localStorage['venue'] || '[]'); 
    var prize = angular.fromJson(window.localStorage['prize'] || '[]'); 

    function persist_venue() { 
     window.localStorage['venue'] = angular.toJson(venue); 
    } 

    return { 

     list_venue: function() { 
     return venue; 
     }, 

     get_venue: function(venueId) { 
     for (var i=0; i<venue.length; i++) { 
      if (venue[i].id === venueId) { 
      return venue[i]; 
      } 
     } 
     return undefined; 
     }, 

     create_venue: function(venueItem) { 
     venue.push(venueItem); 
     persist_venue(); 
     }, 

     list_prize: function() { 
     return prize; 
     }, 

     get_prize: function(prizeId) { 
     for (var i=0; i<prize.length; i++) { 
      if (prize[i].id === prizeId) { 
      return prize[i]; 
      } 
     } 
     return undefined; 
     }, 

     create_prize: function(prizeItem) { 
     venue.push(prizeIem); 
     persist_prize(); 
     } 
    }; 

    }); 

Answer 1

我的做法是在工厂返回

angular.module('app.datastore', []) 
    .factory('DataStore', function() { 

    var getStoreFunction = function (storeName) { 
     var store = angular.fromJson(window.localStorage[storeName] || '[]'); 

     function persist() { 
      window.localStorage[storeName] = angular.toJson(store); 
     }; 

     return { 
      list: function() { 
       return store; 
      }, 

      getItem: function (id) { 
       return store.find(function (elem) { 
        return elem.id === id; 
       }); 
      }, 

      createItem: function (item) { 
       store.push(item); 
       persist(store); 
      } 
     } 
    }; 

    return { getStore : getStoreFunction }; 
}); 

您可以通过使用

var venueStore = DataStore.getStore('venue'); 
//use of your store 
venueStore.createItem({ 
    id : venueStore.list().length + 1, 
    name : 'myVenue' + venueStore.list().length + 1 
}); 
$scope.venues = venueStore.list(); 

创造无限的存储函数将返回一个类型的商店（场地，奖金，...）

如果您想要或直接在您的控制器中使用它，您可以创建一个工厂类型，如下例所示：https://jsfiddle.net/royto/cgxfmv4q/

Answer 2

我不知道如果你熟悉约翰爸爸的角风格指南，但你真的应该看看它可以帮助你有很多的设计问题。 https://github.com/johnpapa/angular-styleguide

反正 - 我会建议你使用这种方法 -

angular.module（ 'app.datastore'，[]）

.factory（ '数据存储'，函数（）{

var venue = angular.fromJson(window.localStorage['venue'] || '[]'); 
    var prize = angular.fromJson(window.localStorage['prize'] || '[]'); 

    return { 
     list_venue: list_venue, 
     persist_venue: persist_venue, 
     get_venue: get_venue, 
     create_venue: create_venue, 
     list_prize: list_prize, 
     get_prize: get_prize, 
     create_prize: create_prize 
    }; 

    function persist_venue() { 
     window.localStorage['venue'] = angular.toJson(venue); 
    } 

    function list_venue() { 
     return venue; 
    } 

    function get_venue(venueId) { 
     for (var i = 0; i < venue.length; i++) { 
      if (venue[i].id === venueId) { 
       return venue[i]; 
      } 
     } 
     return undefined; 
    } 

    function create_venue(venueItem) { 
     venue.push(venueItem); 
     persist_venue(); 
    } 

    function list_prize() { 
     return prize; 
    } 

    function get_prize(prizeId) { 
     for (var i = 0; i < prize.length; i++) { 
      if (prize[i].id === prizeId) { 
       return prize[i]; 
      } 
     } 
     return undefined; 
    } 

    function create_prize(prizeItem) { 
     venue.push(prizeIem); 
     persist_prize(); 
    } }); 

我喜欢这种做法，因为在上面你可以看到所有可用的功能在这个厂好和容易， 你也可以重用每次暴露之外，里面还有功能，所以它非常EFFE希望有帮助， 祝你好运。