(Angularjs) Data not synchronising between views sharing one controller

Question

I have two views sharing the same controller and use a service to pass data between them.

Let's say we have view1 and view2, a button pressed in view2 should change something in view1.

When view1 is charged, the data stored in the service is its $scope (the $scope of the instance of the controller if I'm not mistaking).

So when the button is pressed in view2, the service updates something on the $scope of view1. The thing is, it works well when view1 and view2 are charged simultaneously (view2 is a menu hidden on the right and is always there).

But when I switch page (I charge view3) and come back to view1 (keep in mind that view2 isn't recharged) it won't work anymore, and it feels like my views don't use the same service since when I check in both of them the data is different !!

I don't know if I explained it well but if you have some ideas on why it doesn't work I'd be glad. Here's some of the code :

my routes :

 $routeProvider.
      when('/', {
        templateUrl: 'js/views/presentation.html'
      }).
      when('/action', {
        templateUrl: 'js/views/main.html'
      }).
      when('/about', {
        templateUrl: 'js/views/about.html'
      });

in the html :

        <li ng-class="{active: routeIs('/')}"><a href="#/">Home</a></li>
        <li ng-class="{active: routeIs('/action')}"><a href="#/action">Action</a></li>
        <li ng-class="{active: routeIs('/about')}"><a href="#/about">About</a></li>

my service :

North.factory('urlupdate', function() {
var factory = {};
var propertyListener;

factory.setPropertyHost = function(value) {
propertyListener.host = value;
};

factory.setPropertyActionport = function(value) {
propertyListener.actionPort = value;
};

factory.setPropertyindexPort = function(value) {
propertyListener.indexPort = value;
};

factory.setPropertyserviceport = function(value) {
propertyListener.serviceport = value;
};

factory.registerForPropertyUpdate = function(listener) {
propertyListener = listener;
};

factory.getProperty = function() {
    return propertyListener.host;
}

factory.getRegister = function() {
    return propertyListener;
}

return factory;    
});

The part of my controller :

North.controller('northcontroller', ["$scope",'myService','location','urlupdate','$rootScope','$timeout',

function ($scope,myService,location,urlupdate,$rootScope,$timeout) {

$scope.begin = function(){
//some code

    urlupdate.registerForPropertyUpdate($scope);
    alert(urlupdate.getRegister()); // shows an object
}

function updatevariable(url, port) {
    alert(urlupdate.getRegister()); // shows a different object, or even "undefined" if the main page wasn't on "view1" when it loaded.
    $rootScope.host=url;
    $rootScope.actionPort=9000+port;
    $rootScope.indexport=9001+port;
    $rootScope.serviceport=9002+port;

    urlupdate.setPropertyHost($rootScope.host);    
    urlupdate.setPropertyActionport($rootScope.actionPort);
    urlupdate.setPropertyindexPort($rootScope.indexport)
    urlupdate.setPropertyserviceport($rootScope.serviceport)


}

The function updatevariable is called in view2.

I have no idea why it stops working after my route is modified I'm kind of new to angularjs.

I you want to see more code I'll provide, I just want to know if I forgot something or if there's something to know about route/services/controllers that I missed.

I will try but it will take some time since I have several html pages — lucasaa
– lucasaa, Commented Apr 22, 2015 at 13:05
My suggestion would be to use $scope.$emit and $scope.$broadcast for your purposes isnstead of creating a fatory of urlupdate - Reference dotnet-tricks.com/Tutorial/angularjs/… — Kushal
– Kushal, Commented Apr 22, 2015 at 13:13
I have the exact same problem, I managed to make it work with $scope.$broadcast and using two separates controllers....but when I change route/page it's not working anymore. Thanks anyway. — lucasaa
– lucasaa, Commented Apr 22, 2015 at 13:48

Pankaj Parkar · Accepted Answer · 2015-04-22 12:53:26Z

0

First thing you need to do is define propertyListener object the add properties to it

var propertyListener = {};

answered Apr 22, 2015 at 12:53

Pankaj Parkar

136k23 gold badges241 silver badges307 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Kushal Over a year ago

He uses registerForPropertyUpdate to store $scope .. so its not necessary to use it

lucasaa Over a year ago

Thanks for reminding me ! Sadly it doesn't solve my problem :/

Collectives™ on Stack Overflow

(Angularjs) Data not synchronising between views sharing one controller

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related