Синхронизация представлений двух угловых приложений

Question

У меня есть два угловых приложения на одной странице, и мне нужно, чтобы они общались. В частности, я хочу, чтобы одно приложение использовало сервис другого приложения. Я могу получить сервис другого приложения, используя Injector.get (service), но когда я меняю данные с помощью службы в одном приложении, это не отражается в представлении другого, хотя оба они должны показать те же данные. Вы можете увидеть упрощенную версию проблемы в jsFiddle. Чтобы сэкономить щелчок, это соответствующий скрипт:

//myAppLeft - an angular app with controller and service 
    var myAppLeft = angular.module('myAppLeft', []); 

    myAppLeft.factory('Service1',function(){ 
     var serviceInstance = {}; 
     serviceInstance.data = ['a','b','c','d','e']; 

     serviceInstance.remove = function(){ 
      serviceInstance.data.pop(); 
      console.log(serviceInstance.data); 
     }; 
     return serviceInstance; 
    }); 
    myAppLeft.controller('Ctrl1', ['$scope', 'Service1', function($scope, service1) { 
     $scope.data = service1.data; 
     $scope.changeData =function(){ 
      service1.remove(); 
     } 
    }]); 
    var leftAppInjector = angular.bootstrap($("#leftPanel"), ['myAppLeft']); 

    //myAppRight = an angular app with controller which uses a service from myAppLeft 
    var myAppRight = angular.module('myAppRight', []); 

    myAppRight.controller('Ctrl2', ['$scope', function($scope) { 
     $scope.data = leftAppInjector.get('Service1').data; 
     $scope.changeData =function(){ 
      leftAppInjector.get('Service1').remove(); 
     } 
    }]); 

    var rightAppInjector = angular.bootstrap($("#rightPanel"), ['myAppRight']); 

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

Thanks, Nurit.

Answer 1

Угловые приложения - это отдельные объекты, даже если вы используете одну и ту же службу в обоих. второе приложение просто инициализирует свою версию. Что вы хотите, это можно сделать с помощью localStorage и storage events. Пинг меня, если вам нужна дополнительная помощь!