I don’t even know how to explain this directly, but I’ll try.<\/p>\n
Intro<\/strong><\/p>\n I’m building a Phonegap App with angularjs, and I’m trying to stitch up WebSocket messages to update my UI. I used to have services that communicate with the server periodically and change their data accordingly and it was working pretty well. An example:<\/p>\n Service1.js<\/em>:<\/p>\n So basically I was simply calling the “update” function every 5 seconds, receiving data from the server and updating this service. The controllers would then simply access this service, and everything was working.<\/p>\n The problem<\/strong><\/p>\n The problem now, is that I stitched up a WebSocket Interface written in java, that handles all the websocket implementation for me. I took it from: https:\/\/github.com\/ziadloo\/PhoneGap-Java-WebSocket . It basically registers an Javascript Interface accessible from Javascript to communicate with java.<\/p>\n Everytime I have a change now, I simply push a string from the server via the WebSocket saying that it should update, and then I call the “update” function from the service in my javascript, instead of querying for data periodically, which is just stupid.<\/p>\n The WebSockets are working well. I can see the message coming, I call the update, it fetches everything correctly from the server, the “update” function calls then the “applyUpdate” with the correct values and etc, even the “$rootScope.$apply” gets called.<\/p>\n But all updated data inside the angular Service is not visible! It seems that all these changes are being run in a different thread!?!?<\/strong>. I know javascript is single threaded, but it just seems so.<\/p>\n Let me put this in a better way: I have the impression that as soon as the WebView calls the javascript callback function, I have a different javascript “thread” running, and nothing outside it can be accessed<\/strong><\/p>\n More about it<\/strong><\/p>\n I wrote a function that simply outputs a number every 5 seconds<\/strong>. The websocket updates this number. And my output is the following:<\/p>\n Then after the WebSocket pushes the data with a new Number (2), I get TWO prints:<\/p>\n Anyone has any pointers about this? Anyone tried doing something similar? I’m no angular pro, but it just seems that everything gets messed up as soon as I get a callback from the java interface.<\/p>\n I have already looked at: Angularjs model changes after websocket data push from server and my code looks very similar. The only problem I think is this callback from Java.<\/p>\n Thank you<\/p>\n Update<\/strong> : It’s a problem with AngularJS. If I set this variable in a window global variable, everything get’s assigned normally. Is it possible that Angular is somehow creating two different $scopes?<\/p>\n Update[2]<\/strong>: Just to be a bit more clear: In the browser, everything works as expected. Only when I run it in the emulator that this thing gets messed up.<\/p>\n Originally posted 2014-01-04 02:50:22. <\/small><\/p>","protected":false},"excerpt":{"rendered":" I don’t even know how to explain this directly, but I’ll try. Intro I’m building a Phonegap App with angularjs, and I’m trying to stitch up WebSocket messages to update my UI. I used to have services that communicate with the server periodically and change their data accordingly and it was working pretty well. An […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-2164","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts\/2164","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/comments?post=2164"}],"version-history":[{"count":0,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts\/2164\/revisions"}],"wp:attachment":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/media?parent=2164"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/categories?post=2164"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/tags?post=2164"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}} var applyUpdate = function (\n angular.extend(instance, data);\n if (!$rootScope.$$phase) $rootScope.$apply();\n };\n\n this.update = function () {\n DataProvider.get('getThermostatSettings', {}, applyUpdate, function(){}, true);\n }\n<\/code><\/pre>\nN: 1\nN: 1\n<\/code><\/pre>\nN: 1\nN: 2\n\nN: 1\nN: 2\n\nN: 1\nN: 2\n<\/code><\/pre>\n