AngularJS: Глобальная переменная для двух инстанций одного контроллера?

Question

[akdes]

Привет.
Есть контроллер, который необходимо отобразить на странице дважды, в разных местах, и частично с разным функционалом.
Дело в том, что при инициализации контроллера, он подгружает данные удалённо; при взаимодействии с контроллером, данные меняются, что должно происходить центрально.
В контроллере есть переменная controllVar = this; в controllVar.data подгружаются данные, которые во время использования меняются.

Необходимо вынести подгрузку данных вне этого контроллера (подгрузка идёт при запуске страницы и по таймеру), и дать доступ контролеру к этим данным.
В Ангуляре новичок, пытался сделать синхронизацию посредством сервисов - не получилось, забил.
Вот кусок этого контроллера:

app.controller('SomeController', ['$http', function($http){
    var  controllVar= this;
     controllVar.data= [];
     controllVar.exists = 0;
    //Function to load Friendsdata
    $http.get(api+'?getFoo').success(function(data){
      controllVar.data = data;
      if(jQuery.isEmptyObject(data))
         controllVar.exists = 1; 
    });

Спасибо.

Answer 1

[Mikhail Osher]

Вынесите все эти данные в сервис, который будет хранить централизованно.

// EDIT

Голова совсем не варит, набросал Вам код на коленке.)
Я бы поступал примерно так.

app.service('Foo', function($q, $http) {
  // Promise cache
  var cache = {};
  
  // Consider we've some url
  var API_URL = '/api/v1/';
  
  /**
   * Get friends data
   */
  this.getFriendsData = function() {
    return apiCall('getFriendsData');
  };
  
  /**
   * Get upcoming events
   */
  this.getUpcomingEvents = function() {
    return apiCall('getUpcomingEvents', {since: Date.now()});
  };
  
  function apiCall(method, params) {
    // Check internal cache
    if (!cache[method]) {
      // Create new deferred for method
      var deferred = $q.defer();
      cache[method] = deferred.promise;
      
      // Merge params
      // e.g. some tokens/keys may exist in default params
      var data = {params: angular.extend({}, params)};
      
      // Process request
      $http.get(API_URL + method, data).then(function(response) {
        deferred.resolve(response);
      });
    }
    
    return cache[method];
  }
});

app.controller('FirstCtrl', function(Foo) {
  // viewmodel reference
  var vm = this;
  
  Foo.getFriendsData().then(function(friendsData) {
    vm.friendsData = friendsData;
  });
});

app.controller('SecondCtrl', function(Foo) {
  // viewmodel reference
  var vm = this;
  
  Foo.getUpcomingEvents().then(function(upcomingEvents) {
    vm.upcomingEvents = upcomingEvents;
  });
  
  Foo.getFriendsData().then(function(friendsData) {
    // $http.get won't be called, getting data from promise cache
    vm.friendsData = friendsData;
  });
});

Comments

[akdes]

Подскажите как сделать постоянную синхронизацию. В данном случае хотелось бы иметь что-то типа указателей как в Си. Сделал сервис, данные присваиваю в начале контроллера из сервиса. Но теперь при каждом действии необходимо забирать их из сервиса... Проблемы нет, но может есть какой-то умный указатель, где основная перменная контроллера постоянно ссылается на данные сервиса?

[akdes]

Я тебе в скайп написал - тишина =(

Answer 2

[Ramallah]

1. Смотри использование сервисов. Любые внешние обращения делай через сервисы - потом проще будет. Тем более, у тебя там целое АПИ существует.

2. Если на странице есть 2 и более одинаковых мест - облегчи себе жизнь, напиши директиву.

var  controllVar= this;
     controllVar.data= [];
     controllVar.exists = 0;

Че за лажа? Где твой $scope?

Comments

[Сергей Протько]

Все правильно, не нужно скоуп в контроллеры пихать.

Читать Controller As Syntax

[Ramallah]

Действительно, спасибо. Этот момент провтыкан.