AngularJS RESTful Web Service GET and POST API

AngularJS RESTful Web Service GET and POST API

Angularjs with restful web services example

we show to use simple Angular $http protocol service to invoke easy way to RESTful APIs Like as a(HTTP GET method, PUT method, POST method, DELETE method) operations.

Angular $http can be easy used to invoke simple HTTP GET webservice in below manner.

RESTful web services Like as use HTTP protocol simple methods for the other operations they perform.Methods are:
RESTful Web Service with AngularJS
GET
POST
PUT
DELETE

simple CRUD RESTful Example with php service used with AngularJS and MySQL

include Script
[php]
https://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.min.js
http://index.js
http://angular-resource.js

var myApp = angular.module(‘myApp’, [‘ngResource’]);

[/php]

AngularJS $http – RESTful API Examples

RESTful GET operation

[php]
$http({
method : ‘GET’,
url : ‘websitelist’
}).then(function successCallback(result) {
$scope.websitelist = result.data.websitelist;
}, function errorCallback(result) {
console.log(result.statusText);
});
[/php]

RESTful POST operation

[php]
$http({
method : “POST”,
url : “websitelist”,
data : angular.toJson($scope.form),
headers : {
‘Content-Type’ : ‘application/json’
}
}).then( _success, _error );
[/php]

RESTful PUT operation

[php]
$http({
method : “PUT”,
url : “websitelist/” + $scope.form.id,
data : angular.toJson($scope.form),
headers : {
‘Content-Type’ : ‘application/json’
}
}).then( _success, _error );
[/php]

RESTful DELETE operation

[php]
$http({
method : “DELETE”,
url : “websitelist/” + employee.id
}).then( _success, _error );
[/php]

RESTful Web Service with AngularJS Example 1

in this Example to show you all the data display json using AngularJS and PHP webservice

index.html
[php]

{{study_result[0].study_name}}

{{study_result[0].study_desc}}

{{study_result[1].study_name}}

{{study_result[2].study_name}}

{{study_result[2].study_desc}}

[/php]

index.js
[php]
var myapp = angular.module(‘myapp’, [‘ngRoute’,’ngTouch’]);

myapp.controller(‘homeCtrl’, function ($scope, $http ,$routeParams) {
$http.get(‘api/index.php/get_study’).success (function(data){
$scope.study_result=data.data;
});
});
[/php]

api/index.php
[php]

$app->get(‘/get_study’, ‘get_study_master’);

———————–
function get_study_master()
{
$data=array();
$data[‘response’]=”success”;
$data[‘data’]=array();
try
{
$partySS=”select * from study_mst ORDER BY seq”;
$db=getConnection();
$partyQQ=$db->query($partySS);
$partyQQ->setFetchMode(PDO::FETCH_ASSOC);
$i=0;

while($partyRR=$partyQQ->fetch(PDO::FETCH_ASSOC))
{

$data[‘data’][$i][‘study_id’]=$partyRR[‘study_id’];
$data[‘data’][$i][‘study_name’]=utf8_encode($partyRR[‘study_name’]);
$data[‘data’][$i][‘study_desc’]=utf8_encode($partyRR[‘study_desc’]);
$i++;
}

echo json_encode($data);
}
catch(PDOException $e)
{
echo ‘{“Response”:”0″,”ERROR”:”Please Enter Correct Data”}’;
echo $d1 = ‘{“error”:{“text”:’ . $e->getMessage() . ‘}}’;
}

}
[/php]

RESTful Web Service with AngularJS Example 2

in this Example to show you all the data display json using AngularJS and PHP webservice

[php]
http://infinityknow.com/weblist
{“id”:1,”comment”:”Live24u is very useful website..”}
[/php]

Create an AngularJS Controller

public/index.js
[php]
angular.module(‘liveapp’, [])
.controller(‘liveCtrl’, function($scope, $http) {
$http.get(‘http://infinityknow.com/weblist’).
then(function(response) {
$scope.weblist = response.data;
});
});
[/php]

Create the Application Page

public/index.html

[php]

http://angular.min.js
http://index.js

[/php]

Download

Example