Привет, я новичок в angular JS, и я пытаюсь реорганизовать свой контроллер и хочу переместить повторяющуюся функцию мультисортировки как услугу и вызвать ее обратно в контроллере.

Может ли кто-нибудь помочь мне преобразовать эту функцию ниже в качестве службы, поскольку она имеет всю $ scope, и я знаю, что ее нельзя использовать в службе или на фабрике:

$scope.multiSort = function(columnName){

            if($scope.orderByField.includes(columnName)){
                if(reverseSortObj[columnName].count == 2){
                    var index = $scope.orderByField.indexOf(columnName)
                    $scope.orderByField.splice(index, 1);
                    delete reverseSortObj.columnName;
                    return;
                }
                var indexToReplace = $scope.orderByField.indexOf(columnName);
                $scope.orderByField[indexToReplace] = '-'+ columnName;
                reverseSortObj[columnName].reverse = !reverseSortObj[columnName].reverse;
                reverseSortObj[columnName].count ++;
            }
            else if($scope.orderByField.includes('-'+ columnName)){
                if(reverseSortObj[columnName].count == 2){
                    var index = $scope.orderByField.indexOf('-' + columnName)
                    $scope.orderByField.splice(index, 1);
                    delete reverseSortObj.columnName;
                    return;
                }
                var indexToReplace = $scope.orderByField.indexOf('-' + columnName);
                $scope.orderByField[indexToReplace] = columnName;
                reverseSortObj[columnName].reverse = !reverseSortObj[columnName].reverse;
                reverseSortObj[columnName].count ++;
            }
            else{
                reverseSortObj[columnName] = {};
                reverseSortObj[columnName].reverse = false;
                reverseSortObj[columnName].count = 1;
                $scope.orderByField.push(columnName);
                
            }
        }
0
Jets 28 Июл 2021 в 10:00

2 ответа

Лучший ответ

Создайте сервис и отправьте свой параметр. Следующий код не тестировался, но вы должны уловить идею. Присылайте нужные вам предметы и делайте работу. При изменении двух переменных я бы рекомендовал вернуть объект с orderByField и reverseSortObj в качестве его свойств, поскольку вы не обязательно хотите полагаться на передачу по ссылке. После возврата вы хотите установить измененные значения для вашей области или локальных переменных.

'use strict';

angular.module("myApp").factory('sortService', {
    function multiSort(orderByField, reverseSortObj, columnName) {
        if(orderByField.includes(columnName)){
            if(reverseSortObj[columnName].count == 2){
                var index = orderByField.indexOf(columnName)
                orderByField.splice(index, 1);
                delete reverseSortObj.columnName;
            } else {                
                var indexToReplace = orderByField.indexOf(columnName);
                orderByField[indexToReplace] = '-'+ columnName;
                reverseSortObj[columnName].reverse = !reverseSortObj[columnName].reverse;
                reverseSortObj[columnName].count ++;
            }
        }
        else if(orderByField.includes('-'+ columnName)){
            if(reverseSortObj[columnName].count == 2){
                var index = orderByField.indexOf('-' + columnName)
                orderByField.splice(index, 1);
                delete reverseSortObj.columnName;                    
            } else {
                var indexToReplace = orderByField.indexOf('-' + columnName);
                orderByField[indexToReplace] = columnName;
                reverseSortObj[columnName].reverse = !reverseSortObj[columnName].reverse;
                reverseSortObj[columnName].count ++;
            }
        } else {
            reverseSortObj[columnName] = {};
            reverseSortObj[columnName].reverse = false;
            reverseSortObj[columnName].count = 1;
            orderByField.push(columnName);                
        }
        
        return { orderByField: orderByField, reverseSortObj: reverseSortObj };
    }
        
    return {
        multiSort: multiSort
    };
});


// in controller or directive
var result = sortService.multSort($scope.orderByField, reverseSortObj, columnName);
$scope.orderByField = result.orderByField;
reverseSortObj = result.reverseSortObj;
0
Esaith 28 Июл 2021 в 16:14

Если вы не хотите изменять код, вы можете напрямую передать $ scope в службу и получить как scope.

Ниже приведен рабочий пример, упрощенный по вашим требованиям.

(function(){
 var app = angular.module('App', []);
 
 app.controller('AppController', ['$scope', 'AppService', function($scope, AppService){
  $scope.text = 'Hello World';
  $scope.columns = ['a', 'c', 'b'];
  $scope.sorted = AppService.sort($scope);
  
  console.log($scope.sorted);
  
 }]);
 
 
 app.service('AppService', [function(){
 
 var service = {};
 
 service.sort = function(scope){
 
   return scope.columns.sort();
 }
 
 return service;
 
 }]);
 
 
})();
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>

<div ng-app="App">
  <div ng-controller="AppController">{{text}}</div>
</div>
0
Alaksandar Jesus Gene 28 Июл 2021 в 07:19