$http using the response data out of the callback - load the JSON formated response in a factory property

Constantinescu Nicolaie

unread,

Sep 25, 2014, 10:18:50 AM9/25/14

to ang...@googlegroups.com

Dear savvies concerning XHR in Angular.

I have a big trouble with getting the data returned into a property of a factory. I know the data unwraps only in the callback function and in the view (via ng-repeat).
My burning need is to load the JSON as a string in a factory property in order to make it available across application controllers and whatnot.

I have been going in circles with this for quite some time to no avail.

Please, extend a helping hand.

A very small scenario here: http://plnkr.co/edit/YEigOGHm5pbPAVhlQSwt?p=preview
I know is a controller, but I need to load the JSON to $scope.test.

(P.S. I'm going slightly mad over this)

Sander Elias

unread,

Sep 25, 2014, 10:49:21 AM9/25/14

to ang...@googlegroups.com

Hi Constantinescu,

You mean something like this: http://plnkr.co/edit/cWZAmW12SM5dXatKyP6S?p=preview

Does that help you?

If not, drop me a note, with what you are missing, and I will take a second look!

Regards

Sander

Constantinescu Nicolaie

unread,

Sep 26, 2014, 3:55:49 AM9/26/14

to ang...@googlegroups.com

Indeed this is the classical scenario of the code.

The issue here is that I need to break free of the call back function which does something with the data passed. I need to pull out that very data (the JSON) from the callback boundaries into an external variable in order to make it available to another library (OpenLayers3). So, how can I have the data passed over the fence of the callback? The call back is good in order to pass the data to the view through binding, but, when I want to retain it and pass it along in the code further it seems out of my understanding.

Thank you, thank you very much in tagging along in my quest.

--
You received this message because you are subscribed to a topic in the Google Groups "AngularJS" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/d1W5J3qPYX0/unsubscribe.
To unsubscribe from this group and all its topics, send an email to angular+u...@googlegroups.com.
To post to this group, send email to ang...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.

--

Constantinescu Nicolaie
Information Architect
http://www.kosson.ro

Membru în BEX al ANBPR

www.anbpr.org.ro

Director

http://sparceurope.org/

Open Acces Understanding

http://startad.kosson.ro

Information Science Sonar

http://sonar.kosson.ro

digital curator for Nostrum Monumentum

http://memoria.kosson.ro

Sander Elias

unread,

Sep 26, 2014, 11:11:16 AM9/26/14

to ang...@googlegroups.com

Hi Constantinescu,

Ah, I see what your problem is. Well, to get the data 'out' of the promise structure, you need to add an extra layer.

Here is an example of that: http://plnkr.co/edit/mjCmj6cDi4GpDHI8RFs0?p=preview

Is this what you where looking for?

Regards

Sander

Constantinescu Nicolaie

unread,

Oct 9, 2014, 5:37:37 AM10/9/14

to ang...@googlegroups.com

Hi Sander,

I have experimented hi and low and all seems to work just fine if I have the app.js as you have designed it. As soon as I tried to separate the concerns i.e. moving the service in it own file everything broke. Please, see the plunker.

Where do I fail?

on my machine I have as such:

service.js

(function() {
var GetData = function($http) {
    var prom = $http.get('data.js');
    prom.success(function(data) {
      prom.loadedData = data;
    });
    return prom;
};
angular.$inject = ['$http'];
angular.module('plunker')
    .service('GetData', GetData);
}());

controller.js

(function() {
function crl($scope, GetData) {
$scope.test = GetData.loadedData;
};
angular.module('plunker')
.controller('crl', crl);
}());

and index.html

<body ng-controller="crl">
<div>
    <b>$http with callback:</b>
    <br>
    <h3>I'm only vissible after loading</h3>
    <pre>{{test|json:true}}</pre>
</div>
</body>

It is so painful not to understand where my logic breaks in fact.

Please, do help me get out of this mess.

--
You received this message because you are subscribed to a topic in the Google Groups "AngularJS" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/d1W5J3qPYX0/unsubscribe.
To unsubscribe from this group and all its topics, send an email to angular+u...@googlegroups.com.
To post to this group, send email to ang...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.

Marcelo Neves

unread,

Oct 15, 2014, 3:00:21 AM10/15/14

to ang...@googlegroups.com

Hi Constantinescu,

I see what in your example, both files are loading the module, ex: "angular.module('plunker');".
I don't see the module definition, ex: "angular.module('plunker', []);".

Should the module definition to be before loaded. You can split module in more files, but you have what ensure the order lodading files.

I' m sorry by my bad english.

I hope to help.

You received this message because you are subscribed to the Google Groups "AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email to angular+u...@googlegroups.com.

Reply all

Reply to author

Forward