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!

Answer 1

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".