[Update] Retrieve informations from web + refreshing

Hey there. I need to know how retrieve informations from the web in form of JSON object. The similar thing I found on the web was this: https://www.youtube.com/watch?v=sCnGSOaaZFo.
Basically, he takes fresh news from the “freshly pressed” on wordpress (a collection of posts chosen by the wordpress staff) and displays it on the app.
I need to do a similar thing, as I said: display in a tab page of my app the information i put onto that JSON file that stays on my server.
How can I do it? Comparing my app (a standard basic tabs app with some static informations) to the one i found, I have 3 separate files for app, controller and services; instead he has only one. With this little change (I’m weak, I admit it), I can’t adapt his functions, which he retrieves informations from the wordpress json, to mines.

EDIT: Ok, thanks to the comment and some research we got it. Now the problem
is that every time I go on the “page” with the news, they should be
updated. How can I make it updates every time I go in there?

Hi Veshare. I did something similar. That functionality is done by AngularJS. You can the proper basic info you need @ http://www.ng-newsletter.com/posts/beginner2expert-how_to_start.html

  1. You’ll need a way of converting wordpress content into JSON format that your app can consume. Wordpress has a plugin for that: https://wordpress.org/plugins/json-api/

  2. Have a controller (in the controller.js) that uses the $http service like below (untested code - i trimmed this from mine)

    .controller(‘ViewPosts’, function($scope, $http) {
    // Define function
    $scope.loadPosts = function(){
    $http({
    method: ‘JSONP’,
    url: ‘URL_PROVIDED_BY_WORDPRESS_JSON_PLUGIN’
    }).success(function(data, status, headers, config) {
    // data contains the response
    // status is the HTTP status
    console.log(data);
    $scope.post = data.post;
    // $scope.post = $scope.post.id
    // headers is the header getter function
    // config is the object that was used to create the HTTP request
    }).error(function(data, status, headers, config) {
    console.log(status);
    // alert(status);
    });
    }
    $scope.loadPosts();
    })

Things to Look up:

  1. JSONP
  2. Databinding: http://www.ng-newsletter.com/posts/beginner2expert-data-binding.html

Hope this helps.

Thank you for the reply, @semoju. I will try this in the very moment I stop posting on forum.
But I also searched for on stackoverflow and found this: http://stackoverflow.com/questions/16930473/angularjs-factory-http-get-json-file.
Basically, in my factory method, I do the same things, but I cannot reach the server. That’s my code:
.factory('Advices', function($http) { var advices = null; $http.get('http://myurl.myext/myfile.json').success(function (data) { advices = data; }).error(function(error) { console.log('error'); //even if there i print the error it prints nothing });

What do I do wrong?

CORS problem?

check our javascript console in safari, firefox, chrome… what you are using. There should be a message if there is a cors problem.

To solve the cors problem:

  • start chrome with the flag --disable-web-security
  • or allow Cors on your server/backend

I’m testing it on device, debugging from console.

Well I tried it. REALLY don’t know how it gives me 404 error!
Then I thought that the url can be wrong: should I include the http:// or just // or what?

you should add the complete url with “http://” or “https://”

Because devices will autocomplete these with “files://” to access local placed resources.

Ok, and it’s what i did. :frowning:

Was this. Had to enable CORS to allow the reading of data.

Ok, thanks to the comment and some research we got it. Now the problem is that every time I go on the “page” with the news, they should be updated. How can I make it updates every time I go in there?

everytime your controller gets executed call you api?

I didn’t, but now it works; thanks. =)