Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Angularjs communication between controllers in different tabs [duplicate]

I have controller A which sends some data to shared service and controller B which should read that data. The problem is Controller B is on a different page (on same website) than controller A, i.e. I do smth. on controller A, click button (which sends data to service) and open another page where is controller B which should read data from service. But nothing happens, so my question is can controllers on different pages communicate this way ?

Here is how I tried to do it but with no luck:

Service:

publicApp.angularModule.service('controllerCommunicationService', function ($rootScope) {
    var communicationService = {};
    communicationService.data = null;

    communicationService.setDataForBroadcast = function(data) {
        this.data = data;
        this.broadcastData();
    };

    communicationService.broadcastData = function() {
        $rootScope.$broadcast('handleBroadcast');
    };

    return communicationService;
});

Relevant parts of controller A:

publicApp.angularModule.controller('PublicRoutinesCtrl', function ($scope, $rootScope, routinesService, controllerCommunicationService, bootstrapCarouselService) {


    $scope.goToNextScreen = function() {
        var currentIndex = bootstrapCarouselService.getcurrentSlideIndex();
        controllerCommunicationService.setDataForBroadcast($scope.items[currentIndex].Routine.RoutineId);



    };

Relevant parts of controller B:

 $rootScope.$on('handleBroadcast', function () {
        console.log("TEST");
        $http.post("/EditWorkout/PostRoutineId", { routineId: controllerCommunicationService.data })
             .success(function() {
                 console.log("success");
             })
            .error(function (responseData) {
            console.log("Error !" + responseData);
        });
    });

And even console.log("TEST"); isn't fired.

like image 545
hyperN Avatar asked Oct 09 '13 11:10

hyperN


2 Answers

Well there are also two other ways to communicate between tabs. Via cookies with global domain, which is not recommended as not secure.

Or with postMessage:

https://developer.mozilla.org/en-US/docs/Web/API/window.postMessage?redirectlocale=en-US

Demo:

http://html5demos.com/postmessage2

And browser support:

http://caniuse.com/#feat=x-doc-messaging

like image 200
Sebastian Piskorski Avatar answered Oct 08 '22 11:10

Sebastian Piskorski


based on your question

my question is can controllers on different pages communicate this way ?

The answer is no. Angular and javascript for that matter are not designed like that.

If however you mean different views on the same page, then yes, you can use a service. Services are singletons and keep their data across controllers when kept on the same page.

If you really want to send data from one page to another your options are to do it via a querystring(on the url) or posting the data, or if you are supporting only modern browsers then you can use the client side local storage (http://www.w3schools.com/html/html5_webstorage.asp)

like image 7
Anton Avatar answered Oct 08 '22 09:10

Anton