title: Using AngularJS to consume REST
body: <p>I've made a REST api using Flask which gives a JSON response on <a href="http://localhost:5000/api/person" rel="nofollow">http://localhost:5000/api/person</a> giving the id,names and phone numbers of all the people in a SQLite database. <a href="http://localhost:5000/api/person/Name_of_person" rel="nofollow">http://localhost:5000/api/person/Name_of_person</a> gives the JSON response corresponding to a person's name. I want to use AngularJS to consume the API so that I can output the names of all the people along with their phone numbers.</p>
  
  <p><strong>index.html</strong></p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"&gt;&lt;/script&gt;
  &lt;body&gt;
  
  &lt;div ng-app="myApp" ng-controller="customersCtrl"&gt; 
  
  &lt;ul&gt;
  
    &lt;li ng-repeat="x in myData"&gt;
      {{ x.id }} + ', ' + {{x.name }} + ',' + {{x.phone}}
    &lt;/li&gt;
  
  &lt;/ul&gt;
  
  &lt;/div&gt;
  
  &lt;script&gt;
  var app = angular.module('myApp', []);
  app.controller('customersCtrl', function($scope, $http) {
    $http.get("http://localhost:5000/api/person").then(function (response) {
    $scope.myData = response.data.objects;
    });
  });
  &lt;/script&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>Contents of <a href="http://localhost:5000/api/person" rel="nofollow">http://localhost:5000/api/person</a></strong></p>
  
  <pre><code>{
    "num_results": 5, 
    "objects": [
  {
    "id": 24, 
    "name": "Name2", 
    "phone": "9999192938"
  }, 
  {
    "id": 23, 
    "name": "Name3", 
    "phone": "9999192938"
  }, 
  {
    "id": null, 
    "name": "Name4", 
    "phone": "9999192938"
  }, 
  {
    "id": 21, 
    "name": "Name5", 
    "phone": "9999192938"
  }, 
  {
    "id": null, 
    "name": "Name6", 
    "phone": "9999192938"
  }
    ], 
    "page": 1, 
    "total_pages": 1
  }
  </code></pre>
  
  <p>I am pretty sure my syntax is correct but I am getting no output for index.html. Can anyone please explain where I am going wrong? Is it maybe because it is on a local server and is unable to retrieve the data?</p>