Combiner la fonction commune dans les contrôleurs AngularJS

Question

Je travaille avec le projet. J'utilise pagination, checkAll, deleteAll fonctionnalités similaires qui sont communes entre tous les contrôleurs. Je souhaite déplacer le code vers l'usine ou le service, donc je peux l'utiliser pour tous les contrôleurs. J'ai essayé mais pas clair avec la perfection. Je veux un indice. Je sais créer l'usine ou le service, et comment l'intégrer contrôleur mais peu confus avec la logique du déplacement du code semblable.

Je donne un exemple que j'utilise pour écrire dans tous les contrôleurs, Logique pour le tri et la pagination.

$scope.bigCurrentPage = 1; 
$scope.editIndex = ""; 

var sortKey = "name"; 
var sortDirection = "ASC"; 
$scope.filterObj = {order: [sortKey + " " + sortDirection], limit: CONFIG.limit, offset: 0}; 
$scope.filterObj.offset = ($scope.bigCurrentPage - 1) * CONFIG.limit; 

$scope.sortList = function (inputSort) { 
    if (sortKey === inputSort) { 
     sortDirection = (sortDirection === "ASC") ? "DESC" : "ASC"; 
    } else { 
     sortKey = inputSort; 
    } 
    $scope.filterObj.order = [sortKey + " " + sortDirection]; 
    $scope.pageChanged(); 
} 


$scope.getSongs = function() { 
    $scope.filterObj.offset = ($scope.bigCurrentPage - 1) * CONFIG.limit; 
    Song.find({filter: $scope.filterObj}) 
      .$promise 
      .then(function (data) { 
       $scope.items = data; 
       $scope.maxSize = 5; 
       $scope.size = $scope.filterObj.limit; 
       $scope.countingIndex = ($scope.bigCurrentPage - 1) * $scope.filterObj.limit; //Its idea to implement counting. Variable is not part of pagination..////  
      }); 
}; 


$scope.pageChanged = function() { 
    $scope.getSongs(); 
}; 

$scope.pageChanged(); 

De cette façon, je suppose que je fais cela pour les albums et je changerais SORTKEY comme « id », utilisera les services avec l'objet « Album.find », changerait « filtre » et je suis fait, mais le fait est-ce que j'utilise le code commun dans tous les contrôleurs. Comment pourrais-je l'écrire de meilleure façon.

Answer 1

Vous avez beaucoup de propriétés qui sont très difficiles à maintenir en service, donc je vous suggère d'utiliser le contrôleur plutôt que le service, (Ou mettre une variable réutilisable dans le service qui rendrait le code plus sensé). Ci-dessous est créé contrôleur peut être injectable dans n'importe quel autre contrôleur en utilisant $controller dépendance.

Common Controller

app.controller('commonCtrl', function($scope) { 
    $scope.bigCurrentPage = 1; 
    $scope.editIndex = ""; 

    var sortKey = "name"; 
    var sortDirection = "ASC"; 
    $scope.filterObj = { 
     order: [sortKey + " " + sortDirection], 
     limit: CONFIG.limit, 
     offset: 0 
    }; 
    $scope.filterObj.offset = ($scope.bigCurrentPage - 1) * CONFIG.limit; 

    $scope.sortList = function(inputSort) { 
     if (sortKey === inputSort) { 
      sortDirection = (sortDirection === "ASC") ? "DESC" : "ASC"; 
     } else { 
      sortKey = inputSort; 
     } 
     $scope.filterObj.order = [sortKey + " " + sortDirection]; 
     $scope.pageChanged(); 
    } 

    $scope.getSongs = function() { 
     $scope.filterObj.offset = ($scope.bigCurrentPage - 1) * CONFIG.limit; 
     Song.find({ 
       filter: $scope.filterObj 
      }) 
      .$promise 
      .then(function(data) { 
       $scope.items = data; 
       $scope.maxSize = 5; 
       $scope.size = $scope.filterObj.limit; 
       $scope.countingIndex = ($scope.bigCurrentPage - 1) * $scope.filterObj.limit; //Its idea to implement counting. Variable is not part of pagination..////  
      }); 
    }; 

    $scope.pageChanged = function() { 
     $scope.getSongs(); 
    }; 

    $scope.pageChanged(); 
}); 

Vous pouvez injecter cela a créé commonCtrl à tout autre contrôleur en utilisant la dépendance du contrôleur $, commonCtrl actions qu'elle portée au contrôleur où il obtient injecté. Mais les modifications effectuées à partir de controllerA dans commonCtrl ne seraient pas disponibles dans controllerB parce que commonCtrl a donné une copie de sa portée au contrôleur qui l'injecte.

Contrôleur A

app.controller('controllerA', function($scope, $controller){ 
    $controller('commonCtrl', {$scope: $scope}); //inject commonCtrl scope to current scope 
    //common scope will be available from here 
}) 

NOTE

Si vous souhaitez que les modifications soient reflétées dans un autre contrôleur, vous pouvez utiliser le service avec ce contrôleur qui partagent des propriétés communes à différents contrôleurs.