Как разделить общую логику между контроллерами?

У меня есть две страницы и два контроллера, которые выполняют поиск по одному и тому же набору данных. Один имеет простую форму для указания критериев поиска. Другой позволяет пользователю выбирать данные на карте (выбрав область или щелкнув объекты на карте).

Результат поиска затем отображается в таблице данных под элементами управления поиском (на той же странице).

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

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

Часть страницы, которая отображает данные, также является общим шаблоном, включенным вng-include на обеих страницах поиска.

Вот пример:

$scope.selectAllRows = function(){

    var selectedItems = $scope.searchState.selectedItems;

    angular.forEach($scope.searchState.searchResult.rows, function(row){
        // add only if not already selected
        if(selectedItems.indexOf(row) < 0){
            selectedItems.push(row);
        }
    });

};

Эта функция выбирает все строки в таблице. Это связано сng-click кнопки на странице.

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

Я хотел бы удалить дублирование этих функций и перегруппировать общее поведение в одну единицу кода.

Примечание: здесь я пытаюсь поделиться поведением, а не данными. Эти функции будут выполнять одну и ту же логику, но в разных областях.

Так как это действительно презентация / пользовательский интерфейс, и их нужно поставить на$scopeЯ не думаю, что услуга может быть использована, потому что$scope это вещь строго контролируемая и не может быть введена в сервисы.

Я экспериментирую с определением автономной функции в другом файле и вызовом этой функции с обоих контроллеров:

myapp.defineCommonControllerBehaviour = function($scope, someOtherService){
    $scope.selectAlRows = function(){....}

    $scope.someOtherCommonTask = function(){
         someOtherService.doTheTask();
    }

    //etc...
};

//controller 1
myapp.defineCommonBehaviour($scope, someOtherService);

//controller 2
myapp.defineCommonBehaviour($scope, someOtherService);

Это работает, но не очень элегантно, поскольку определяет функцию в глобальной области видимости вне любого углового модуля.

Есть ли какой-то угловой способ добиться этого? Или, по крайней мере, больше в соответствии с архитектурой Angular?

Ответы на вопрос(2)

Ваш ответ на вопрос