Can't access to Object in JSON from server response - angularjs

I'm using following code to get the data from the server:
var deferred = $q.defer();
$http({
method: 'POST',
url: 'URL',
data: $.param({"KEY" : "VALUE"}),
headers: {'Content-Type': 'application/x-www-form-urlencoded'}
}).then(function(response){
deferred.resolve(response.data.data);
}, function(response){
});
return deferred.promise;
Returned value deferred.promise
Promise {$$state: Object}
$$state:Object
status:1
value:Object
server_time:XXXXXXXX
I tried it with deferred.promise.$$state but what i get is state: 0
Thanks for any suggestions

Related

I can't able to read the response from the server in angularjs code

I can't able to read the response from the server in angularjs code. in $http methode , but in chrome inspect network option , i can sea the request and response.
My code is
$http({
method: 'POST',
url: url,
data: data,
responseType: 'arraybuffer',
}).then(function successCallback(res) {
console.log('---res', res);
}, function errorCallback(res) {
console.log('---err', res);
});
$http({
method: 'POST',
url: url,
data: data,
responseType: 'arraybuffer',
transformResponse: appendTransform($http.defaults.transformResponse, function(value) {
return doTransform(value);
})
});
above code worked for me

$q.all promises inject data from first promise to second promise

i would like to know if it's possible here with $q.all:
var promise1 = $http({
method: 'GET',
url: "https://cubber.zendesk.com/api/v2/organizations/"+id+"/users.json",
dataType: 'json',
headers: {'Content-Type': 'application/json',
'Authorization': 'Bearer '+token}
})
var promise2 = $http({
method: 'GET',
url: "https://cubber.zendesk.com/api/v2/users/"+idname+"/tickets/requested.json",
dataType: 'json',
headers: {'Content-Type': 'application/json',
'Authorization': 'Bearer '+token}
});
$q.all([promise1, promise2]).then(function(data){
console.log(data[0], data[1]);
});
If it's possible to retrieve data from promise 1 and inject into the url of promise 2 and then retrieve full data of both promises in the same array ?
For example like this
var responses = [];
$http({ ... }).then(function (response) {
responses.push(response);
return $http({ ... });
}).then(function (response) {
responses.push(response);
console.log(responses[0], responses[1]);
});
See also this answer, with many different ways to handle it.

Send put request from angularjs to laravel

I'm trying to send a put request by angularjs. My app receptor is running laravel.
When I trying send the request, I get the following error message:
TypeError: Cannot set property '_method' of undefined
at $http.transformRequest (http://localhost:8000/js/controller-university.js:91:28)
at transformData (http://localhost:8000/js/libs/angular/angular.js:7433:12)
at serverRequest (http://localhost:8000/js/libs/angular/angular.js:8071:23)
at wrappedCallback (http://localhost:8000/js/libs/angular/angular.js:11572:81)
at wrappedCallback (http://localhost:8000/js/libs/angular/angular.js:11572:81)
at http://localhost:8000/js/libs/angular/angular.js:11658:26
at Scope.$eval (http://localhost:8000/js/libs/angular/angular.js:12701:28)
at Scope.$digest (http://localhost:8000/js/libs/angular/angular.js:12513:31)
at Scope.$apply (http://localhost:8000/js/libs/angular/angular.js:12805:24)
at HTMLFormElement.<anonymous> (http://localhost:8000/js/libs/angular/angular.js:19139:23)
Here my code:
update : function(data) {
return $http({
method: 'POST',
url: '/api/university'+data.id,
headers: {'Content-Type': 'application/x-www-form-urlencoded'},
data: $.param(data)
transformRequest: function(data){
data._method = 'PUT';
return data;
}
});
},
What is wrong?
Here the correct code:
update: function(data){
return $http({
method: 'PUT',
url: '/api/university/'+data.id,
data: $.param(data),
headers: { 'Content-Type' : 'application/x-www-form-urlencoded' }
});
},
var request = {
method: 'put',
url: '/admin/banners/'+$scope.editid,
data: fields,
headers: {
'Content-Type':'application/json'
}
};
It worked for me.

$http POST response from service to controller

How to get the response from Service in below case??
Service:
app.factory('ajaxService', function($http) {
updateTodoDetail: function(postDetail){
$http({
method: "POST",
headers: {'Content-Type': 'application/x-www-form-urlencoded'},
url: post_url,
data: $.param({detail: postDetail})
})
.success(function(response){
//return response;
});
}
})
Controller:
updated_details = 'xyz';
ajaxService.updateTodoDetail(updated_details);
In th above case, i POST the data through Controller and it was working fine but now i want the response to come in my Controller.
How to achive that??
$http returns a promise:
Return the promise
updateTodoDetail: function(postDetail){
return $http({
method: "POST",
headers: {'Content-Type': 'application/x-www-form-urlencoded'},
url: post_url,
data: $.param({detail: postDetail})
});
So you can do
ajaxService.updateTodoDetail(updated_details).success(function(result) {
$scope.result = result //or whatever else.
}
Alternatively you can pass the successfunction into updateTodoDetail:
updateTodoDetail: function(postDetail, callback){
$http({
method: "POST",
headers: {'Content-Type': 'application/x-www-form-urlencoded'},
url: post_url,
data: $.param({detail: postDetail})
})
.success(callback);
So your controller has
ajaxService.updateTodoDetail(updated_details, function(result) {
$scope.result = result //or whatever else.
})
I would prefer the first option so I could handle errors etc as well without passing in those functions too.
(NB: I haven't tested the code above so it might require some modification)
what I usually do is like this
app.factory('call', ['$http', function($http) {
//this is the key, as you can see I put the 'callBackFunc' as parameter
function postOrder(dataArray,callBackFunc) {
$http({
method: 'POST',
url: 'example.com',
data: dataArray
}).
success(function(data) {
//this is the key
callBackFunc(data);
}).
error(function(data, response) {
console.log(response + " " + data);
});
}
return {
postOrder:postOrder
}
}]);
then in my controller I just call this
$scope.postOrder = function() {
call.getOrder($scope.data, function(data) {
console.log(data);
}
}
do not forget to insert the dependency injection of 'call' services into your controller

AngularJS not binding promise to template

My service:
This was mistake 1 of 2 cause of my error:
getAll: function(url) {
deferred.resolve($http({ <--- deferred.resolve should not have been here
method: 'GET',
url: url,
contentType: "application/json; charset=utf-8",
cache: true,
headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
}));
return deferred.promise;
},
Should have been instead:
getAll: function (url) {
$http({
method: 'GET',
url: url,
contentType: "application/json; charset=utf-8",
cache: true,
headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
}).success(function (data) {
deferred.resolve(data);
});
return deferred.promise;
My controller:
This was mistake 2 of 2 cause of my error:
// $scope.PassengerVehicles = crudSvc.getAll('/_json/PassengerVehicles.js');
// should have been:
crudSvc.getAll('/_json/PassengerVehicles.js').then(function (data) {
$scope.PassengerVehicles = data;
});
My template:
<ul data-ng-repeat="passVeh in PassengerVehicles">
<li>{{passVeh.itemId}}</li>
</ul>
Here is my plunker, which has been corrected:
AngularJS not binding promise to template
Than You Fourth!!
You have the getAll() function immediatly resolving and returning a promise to the controller. You need to allow the getAll() function to execute and deal with the promise when that resolves:
getAll: function(url) {
return $http({
method: 'GET',
url: url,
contentType: "application/json; charset=utf-8",
cache: true,
headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
});
},
and in the controller:
crudSvc.getAll('/_json/PassengerVehicles.js').success(function (vehicles){
$scope.PassengerVehicles = vehicles;
});
The difference is that you are returning a promise that immediately resolves and returns another promise. You only need to resolve the http promise.

Resources