2016-07-11 10 views
2

私は自分のコントローラーで自分自身を繰り返す機能を持っています。私は8つの異なるアレイのための8回のようにそれを持っているAngularJSの反復関数の再利用

//FUNCTION 1 

$scope.selectedage = []; 
$scope.pushage = function (age) { 
    age.chosen = true; 
    $scope.selectedage.push(age); 
    console.log($scope.selectedage); 
}; 
$scope.unpushage = function (age) { 
    age.chosen = false; 
    var index=$scope.selectedage.indexOf(age) 
    $scope.selectedage.splice(index,1);  
    console.log($scope.selectedage); 
} 


//FUNCTION 2 

$scope.selectedgender = []; 
$scope.pushgender = function (gender) { 
    gender.chosen = true; 
    $scope.selectedgender.push(gender); 
    console.log($scope.selectedgender); 
}; 
$scope.unpushgender = function (gender) { 
    gender.chosen = false; 
    var index=$scope.selectedgender.indexOf(gender) 
    $scope.selectedgender.splice(index,1);  
    console.log($scope.selectedgender); 
} 

: それはこのようになります。

これを一度書き、いくつかの値を変更するだけで再利用する方法はありますか?

答えて

2

「値」を書き込む必要がある値(コンテナ)を受け入れる汎用関数を作成できます。同様:リファクタリングコードをお使いのコントローラにサービス

(function() { 
    'use strict'; 

    angular 
     .module('myApp') 
     .factory('ItemFactory', ItemFactory); 

    ItemFactory.$inject = []; 

    /* @ngInject */ 
    function ItemFactory() { 
     var service = { 
      toggleItemStatus: toggleItemStatus 
     }; 
     return service; 

     //////////////// 
     /* 
     itemContainer - equivalent to scope 
     item - item to replace or push 
     itemKey - itemKey 
     chosenStatus - true to push and false to remove 
     */ 
     function toggleItemStatus(itemContainer, item, itemKey, chosenStatus) { 
      item.status = chosenStatus; 
      if (chosenStatus == true) { 
       itemContainer[itemKey].push(item); 
      } else { 
       var index = $scope[itemKey].indexOf(item) 
       itemContainer[itemKey].splice(index, 1); 
      } 
      console.log(itemContainer[itemKey]); 
     } 
    } 
})(); 

で再利用することが

$scope.push = function(container, value){ 
    value.chosen = true; 
    container.push(value); 
    console.log(container); 
} 

$scope.unpush = function(container, value){ 
    value.chosen = false; 
    var index = container.indexOf(value) 
    container.splice(index, 1);  
    console.log(container); 
} 

//sample 
$scope.push($scope.selectedage, 10); 
$scope.push($scope.selectedgender, "Male"); 
1
function togglePushStatusOfItem(item, itemKey, chosenStatus){ 
item.status = chosenStatus; 
if(chosenStatus == true){ 
    $scope[itemKey].push(item); 
} else { 
    var index=$scope[itemKey].indexOf(item) 
    $scope[itemKey].splice(index,1); 
} 
console.log($scope[itemKey]); 
} 

togglePushStatusOfItem(user, 'selectedAge',true); 

、あなたは私が作った唯一の違いはということである。この

ItemFactory.toggleItemStatus($scope, item, 'selectedAge', true);// to push item 
ItemFactory.toggleItemStatus($scope, item, 'selectedAge', false);// to remove item 

のようにそれを使用することができます私は同じ機能を使用してアイテムをプッシュしたりプッシュしたりしました。これがあなたを混乱させないことを願っています。

+0

あなたのソリューションはよりエレガントですが、私はそれを実装する方法を本当に理解していません。 –