Hi reader's,
If you have done enough work with the technologies like PHP then you can switch to Angular Js. Using Angular Js is quick and fast to compile than PHP. If you want to fetch Mysql records now a days you can perform same task by using Anguar JS also.
Lets get started working with Angular JS.
Step1 : Create a basic html file name to records.html. By using simple HTML and bit of Anuglar JS you have to desigg the front end of page it's code will go like this:-
<!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="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>
</body>
</html>
Step2: In the above code which is simple a html page now create a div and assign it a angular ID it's code will go like this:-
<div ng-app="getSchool" ng-controller="schoolsCtrl">
<table>
<tr ng-repeat="x in names">
<td>{{ x.School }}</td>
<td>{{ x.City }}</td>
</tr>
</table>
</div>
Step 3: Since you have already call the Angular JS from CDN so it will find the div with ng-app and put the results from the mysql file inside the table which we had created above. By writing ng-repeat = "x" you don't have to write code for loops. It will auto fetch mulitple records and put then in row by row. All you need to is create the js code it will go like this:-
<script>
var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {
$http.get("localhost/myproject/school_mysql.php")
.then(function (response) {$scope.names = response.data.records;});
});
</script>
In the code above you can see the ajax hit initiated which will target to shool_mysql.php file. In this file you can write the same query which you have used to PHP. The result should be return back and those will print on the Table inside the div (getSchool). You will notice that there is no compiling time taken by server like in PHP. Anguar will print the records in real time. Which makes it fast.
0 Comment(s)