Angular JS - Невозможно определить подходящее место для размещения фрагмента кода, который будет использоваться разными страницами

Question

Я делаю страницу, которая извлекает некоторую информацию с сервера и показывает ее на интерфейсе. Для этого я использую угловые js. Поэтому я создал контроллер, который имеет метод $http.get(), который получает данные с сервера, а затем привязка данных используется для привязки данных к странице html. Я использую этот контроллер ...

mission_vision_mod.controller('mission_visionCtrl', ['$scope','$http', function($scope, $http) { 
     $scope.visiontext = "Here is the content of vision"; 
     $scope.bkclr = ['bk-clr-one','bk-clr-two','bk-clr-three','bk-clr-four']; 
     $scope.progressbar = ['progress-bar-warning','progress-bar-danger','progress-bar-success','progress-bar-primary']; 
     $scope.missioncount = ['col-md-0','col-md-12','col-md-6','col-md-4','col-md-3','col-md-2.5','col-md-2']; 

     $http.get('m_id.json').success(function(data){ 
      $scope.missions = data; 
      $scope.len = data.length; 
     }); 
}]); 

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

Answer 1

Я бы предложил переместить этот код в Сервис, а затем ввести и использовать эту службу в каждом из контроллеров, где вам нужна эта функциональность.

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

Надеюсь, это поможет!

Answer 2

Услуга/завод/значение предназначены для этого, пожалуйста, обратитесь к приведенному ниже примеру, надеясь, что вы получите лучшую идею.

var app = angular.module('myApp',[]); 

//controller 

    app.controller('myCtrl',myCtrl); 

    //inject dependencies 

    myCtrl.$inject = ["$scope","httpService"]; 

    function myCtrl($scope,httpFactory){ 
     $scope.data = httpFactory.getData; 

    } 


//factory : http factory 

     app.factory('httpFactory',httpFactory); 

     //inject dependencies 

     httpFactory.$inject = ["$http"]; 

     function httpFactory($http){ 
      var datas = []; 
      return { 

       getData:function(){ 

         $http.get('url').success(function(data){ 
          datas.push(data); 
          }). 
         error(function(){ 
           console.log('error'); 
         }); 
        return datas 
        } 

      } 

      }