DEV Community

Cover image for How to fetch data from the database using AngularJs in php?
bingchandler671
bingchandler671

Posted on

How to fetch data from the database using AngularJs in php?

AngularJs code to get MYSQL data:

<script>

var app = angular.module('myApp', []);

app.controller('usersCtrl', function($scope, $http) {

  $http.get("https://freewebmentor.com/api/users_mysql.php")

  .then(function (response) {$scope.names = response.data.records;});

});

</script>

//UserCtrl is used to display all the user data on your web page.

div ng-app="myApp" ng-controller="usersCtrl">

<table>

  <tr ng-repeat="result in names">

    <td>{{ result.username }}</td>

    <td>{{ result.email }}</td>

  </tr>

</table>

</div>
Enter fullscreen mode Exit fullscreen mode

Read more

HTML Form:

<!DOCTYPE html>

<html >

<style>

table, th, td {

  border: 1px solid grey;

  border-collapse: collapse;

  padding: 5px;

}

table tr:nth-child(odd) {

  background-color: #f1f1f1;

}

table tr:nth-child(even) {

  background-color: #ffffff;

}

</style>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

<body>
<div ng-app="myApp" ng-controller="usersCtrl">
<table> 

  <tr ng-repeat="x in results">

    <td>{{ x.username }}</td>

    <td>{{ x.email }}</td>

  </tr>

</table>
</div>
<script>

var app = angular.module('myApp', []);

app.controller('usersCtrl', function($scope, $http) {

  $http.get("https://freewebmentor.com/api/users_mysql.php")  

  .then(function (response) {$scope.results = response.data;});

});

</script>
</body>
</html>

Enter fullscreen mode Exit fullscreen mode

Top comments (0)