how to get data from WP-API url

Question

I'm using the plug-in wp-api, how can I get data such as the post titles from this url?

http://scd.blaze.wpengine.com/wp-json/posts?type=listings&filter[listing_area]=northwest

I am attempting to get it using Angular JS, I have this code so far -

 <script>

var app = angular.module('myApp', []);
app.controller('regionsLinks', function($scope, $http) {

    var url = 'http://scd.blaze.wpengine.com/wp-json/posts?type=listings&filter[listing_area]=northwest';

 $http.get(url).then(function (data) {

   $scope.data = data;

});

});
</script>


<div ng-app="myApp" ng-controller="regionsLinks">

  <div ng-repeat="d in data">
    <div id="title">
      {{d.title}}
    </div>

  </div>

I realise I'm doing something fundamentally wrong, but I have no idea what, I'm very new to it all,

Any help would be much appreciated, Thanks!

How would I use that to get the data I need? Would it be this kind of structure also? — Lucy Brown, Dec 14 '15 at 10:51
When u have created any syntax url for data get just run on browser so easy to get idea data arrived or not . — Ravi Patel, Dec 14 '15 at 11:07

score 0 · Accepted Answer · answered Dec 14 '15 at 10:51

0

Your data is fetched from an external URL so you need to fetch it using this said URL.

Calling the URL using the angular $http service, you can make an HTTP request to the URL and have JSON data returned.

Replace your $scope.data line by these ones :

var url = 'http://scd.blaze.wpengine.com/wp-json/posts?type=listings&filter[listing_area]=northwest';

$http.get(url).then(function (data) {
   $scope.data = data;
});

This basically means "Make an HTTP request to this URL and put the returned data in $scope.data".

answered Dec 14 '15 at 10:51

Komo

2,043
1
22
35

Thank you for that explanation, that makes sense! I've replaced that code, but I think I'm missing a bracket somewhere - I can't see where though so the code's not working just yet, could you see if you can tell? I've updated my current code – Lucy Brown Dec 14 '15 at 10:59
I think you're missing a `});`before the `` closing tag. – Komo Dec 14 '15 at 11:01
I think you were right with that, it's sorted the code out so the page is working now, but the code still isn't working for me, I've updated the code and this is the link `http://scd.blaze.wpengine.com/test/` If you don't mind could you see where I'm going wrong? I only know just the basics! – Lucy Brown Dec 14 '15 at 11:07
Open your browser console, there's several errors you need to fix before it works (like including angular more than once). – Komo Dec 14 '15 at 11:11
Thank you for pointing that out, it was a function I'd put in and forgotten about whilst trying to get this working! The code still isn't working and I've cleared all errors, any other ideas of what I'm doing wrong? Thanks for all your help so far – Lucy Brown Dec 14 '15 at 11:17
Hmm I think it should work, try putting `{{ data }}` outside the `ng-repeat`to see if there's anything and put a `console.log($scope.data)`after the `$scope.data = data` line then check if the console prints anything – Komo Dec 14 '15 at 11:32
If you check the link now you'll see it outputs all the data, so it must be the way I'm calling the post titles? – Lucy Brown Dec 14 '15 at 11:35
Yes, now I see that all your data is wrapped in another `data` object. So you need to do `$scope.data = data.data;` – Komo Dec 14 '15 at 11:37
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/97845/discussion-between-lucy-brown-and-komo). – Lucy Brown Dec 14 '15 at 11:44
Could I ask your advice on one other thing? I can bring in the titles with {{d.title}} but when I try and bring in something such as name and I use {{d.name}} it doesn't work, why is this? I get the values from this link http://scd.blaze.wpengine.com/wp-json/posts?type=listings&filter[listing_area]=northwest – Lucy Brown Dec 14 '15 at 11:47

how to get data from WP-API url

1 Answers1