on the node server i am sending data to angular as
res.json(data);
at angular i'm making http request to get the data
$http({
method: 'GET',
url: '/doctor/getDocData'
}).then(function(response) {
$scope.docData=JSON.stringify(response);
alert($scope.docData) //alert data
alert($scope.docData.name); //undefined
}, function(response) {
alert("error in loading data")
})
i want to sore the received data and individually print when ever i want. what am i doing wrong.Some one please explain. Thank You.
Don't JSON.stringify() the response as that is turning it back into a string, rather than parsed, structured JSON. Just target the data directly. If you are using $http you may need to get at data of the response object:
$scope.docDate = response.data;
Then you can target the properties:
alert($scope.docData.name);
If for some reason your JSON is coming in as a string, instead of JSON, you can use JSON.parse(response.data) to parse the string to JSON. This assumes it's formatted correctly.
Hopefully that helps!
Related
here is my issue.
I proceed to an ajax request which send me a value for an object (here a mission).
Then i want to print that value using ng-bind-html with angular js.
But here is the thing, the ng-bind is going to take the last value from the ajax request.
So starting with what i have right now, i wanted to use ma be an array or something else to get differents id for m data
$.each(missions, function(key,mission){
$scope.posDate="Calcul en cours";
$http({
method : "POST",
url : "getDatesBasket",
data: {"mission":mission},
async:false
}).then(function successCallback(response) {
$scope.posDate=response['data'];
},function errorCallback(response) {
$scope.posDate="ERREUR DATE";
});
var infoContent = <div ng-controller="missionCtrl"> <p ng-bind-html="posDate"></p></div>
I hope you can see the issue, each time posDate is erased by the next ending ajax request.
If you have an idea that would be great, i've spent more than 2 days with that crap.
Thank you for your help.
As long as I know that option async, that you are using, doesn't works. There is no simple way to do syncronous http requests in angular.
For your problem, if I fully understand what you want to do, you can get response.config that holds the data you've send on request and search in your missions array for that specific mission in every response that you get.
Something like this:
.then(function successCallback(response) {
$.each(missions, function(key, mission) {
if(mission == response.config.data.mission)
mission.postData = response.data; //Or wherever you want to put the data
}
}
I am making a webpage which on load makes 2 queries. However, results of both queries are coming at same time (the longer time) because one is blocking the other. Is there a way i can give a time delay so the other query is made only after the data from first query is loaded ?
Although the information you are providing are not sufficient, I am assuming you are making Ajax requests using Javascript. If that is the case you can use jQuery in order to have some code that will run only after the request answer is received (it might have an error)
$.ajax({
url: "URL for first request here",
method: 'Your request method (POST, GET etc)',
data: 'Here assign any data you need to send'
})
.done(function( data ) {
// This code will be called only if your request is successful
// data is the response from the server
// Perform 2nd Request
$.ajax({
url: "URL for second request here",
method: 'Your request method (POST, GET etc)',
data: 'Here assign any data you need to send'
})
.done(function( data ) {
})
.fail(function(){
});
})
.fail(function(){
// This code will be called only if your request fails
});
I ran into an issue with $http called with responseType: blob.
I would like to handle errors response in JSON but I get blob data instead even if I set the response's content-type as 'application/json' on the server.
$http.post(url, data, {responseType: 'blob'})
.then(function(response) {
// download the file (works fine)
})
.catch(function(error) {
// handle JSON response error
});
Is there any way to do that without trying to convert error data to object?
You can't have different content types for success and error cases, but you can manage conversion in single place. Write responseError interceptor where you can check if error.data is instanceof Blob and convert it to JSON
I'm using
window.location.href = "some ajax call";
for exporting, but when there is large number of data (for eg.5000),I'm getting the result as "Request-URI Too Large "pathname"
does not allow request data with GET requests, or the amount of data provided in the request exceeds the capacity limit."
Can someone please provide me the solution for this problem?
Because url has its limitation, url length can not be exceeds 2,000 characters.
You should use POST request instead of GET and send data inside body.
CODE
$http({
type: 'POST',
url: exportUrl, //this should not contain data
data: "data=" + escape(JSON.stringify(exprotData)),
success: function (data) {
//success code
},
error: function (error) {
//error code
}
});
Hope this could help you. Thanks.
I am getting an error "syntax error JSON parse unexpected end of data at line 1 column 1 of json data". The RESTful service is runnning, a straight test returns valid json data (verified at http://jsonlint.com/)
[{"id":2,"name":"Flourescent Penetrant Inspection","description":"The fluorescent penetrant inspection process.","abbreviation":"FPI","tempId":null,"processType":"INSPECTION","indicationTypes":[{"id":1,"name":"Crack","description":"An identified crack on the piece.","abbreviation":"","tempId":null,"groupName":"","markupType":"LINE","useSizeDescription":true,"sizeDescription":"<= 1 in.::> 1 in.","rejectReason":"Crack","defaultDisposition":"MRB"},{"id":2,"name":"Inclusion","description":"An identified inclusion on the piece.","abbreviation":"","tempId":null,"groupName":"","markupType":"DOT","useSizeDescription":false,"sizeDescription":"","rejectReason":"Inclusion","defaultDisposition":"REWORK"}]},{"id":4,"name":"CMM","description":"The CMM process.","abbreviation":"CMM","tempId":null,"processType":"INSPECTION","indicationTypes":[]}]
The error in the HTTP response, yet it is returning a 200 message. The angular app is seeing it as an empty array. Any ideas?
The applicable part of the Controller is:
indicationTypeController.constant("indicationTypeUrl", "http://localhost:8080/services/api/indication-types.json");
indicationTypeController.controller('indicationTypeController', function ($scope, $http, $resource, indicationTypeUrl) {
$scope.indicationTypeResource = $resource(indicationTypeUrl+":id", { id: "#id" },
{ 'create': {method: "POST"}, 'update': {method: "PUT"}
});
$scope.listIndicationTypes = function () {
$http.get(indicationTypeUrl)
.success(function(data){
$scope.indicationTypes = data;
});
//$scope.indicationTypes = $scope.indicationTypeResource.query();
}
. . . .
As you can see I am currently using a $http.get, I also tried a query().
Any
Usually, the $http promise returns an object that contains the headers and the data. In your success handler for the $http, you have
$http.get(indicationTypeUrl)
.success(function(data){
$scope.indicationTypes = data;
});
I'm pretty sure that data is the full response and you need to get the specific data by using the data property of this object. Therefore, this would become the following:
$http.get(indicationTypeUrl)
.success(function(data){
$scope.indicationTypes = data.data;
});
In other implementations, instead of the passed in parameter being called data, it's usually called result, so that you can reference the contained data like result.data instead of data.data
The other thing to make sure of is that the Content-Type is set appropriately between the server and client. If it's not application\json you'll probably run into issues.
This is an CORS issue, please add the following to the response header, before sending the result.
"Access-Control-Allow-Origin" : "*"
For instance, if you are using play server (Java code) to serve the request, the following statement should be added to the method where you are returning the data from
response().setHeader("Access-Control-Allow-Origin", "*");