Table with Angular

[davy_yg]

Hello,

I am trying to follow the following tutorials:

https://www.w3schools.com/angular/angular_tables.asp

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

<table>
  <tr ng-repeat="x in names">
    <td>{{ x.Name }}</td>
    <td>{{ x.Country }}</td>
  </tr>
</table>

</div>

<script>
var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {
    $http.get("customers.php")
    .then(function (response) {$scope.names = response.data.records;});
});
</script> 

It produces a customer table. I wonder what is in customers.php to produces table like that? Since they do not show it in the tutorial.

[s3xandch0c0late]

Most probably it contains the API that returns the data in the form of an array with Customer Name and Country. This data might be hardcoded in the file, or it is requesting from a table somewhere.

[davy_yg]

What the API file could be look like? Any example ? (an API file that's readable to produce a table consist of name and country.

Since I have a create a table using angular (the data in the table is provided), I only see the result. So I wonder what's the best way to input the data? If not through API is there some other methods to do it?

[Sanjay_23]

I have a solution but when I post solution, getting following error.
Curly braces { } may only be used when posting code.

[JamesCherrill]

click the box labelled </>Code above the editor window to open a frame into which you can post code and retain its formatting.

[xrjf]

Type in Google:

w3schools customers.php
The first link appeared to have:

{ "records":[ {"Name":"Alfreds Futterkiste","City":"Berlin","Country":"Germany"}, {"Name":"Ana Trujillo Emparedados y helados","City":"México D.F.","Country":"Mexico"}, {"Name":"Antonio Moreno Taquería","City":"México D.F.","Country":"Mexico"}, {"Name":"Around the Horn","City":"London","Country":"UK"}, {"Name":"B's Beverages","City":"London","Country":"UK"}, {"Name":"Berglunds snabbköp","City":"Luleå","Country":"Sweden"}, {"Name":"Blauer See Delikatessen","City":"Mannheim","Country":"Germany"}, {"Name":"Blondel père et fils","City":"Strasbourg","Country":"France"}, {"Name":"Bólido Comidas preparadas","City":"Madrid","Country":"Spain"}, {"Name":"Bon app'","City":"Marseille","Country":"France"}, {"Name":"Bottom-Dollar Marketse","City":"Tsawassen","Country":"Canada"}, {"Name":"Cactus Comidas para llevar","City":"Buenos Aires","Country":"Argentina"}, {"Name":"Centro comercial Moctezuma","City":"México D.F.","Country":"Mexico"}, {"Name":"Chop-suey Chinese","City":"Bern","Country":"Switzerland"}, {"Name":"Comércio Mineiro","City":"São Paulo","Country":"Brazil"} ] } 

[jstfsklh211]

use your console to view the response for customers.php