I am trying to send a GET request using AnguarJS $http.get function.
However, the shorthand version is NOT working. Why is that?
Working:
$http({
url: $rootScope.root + '/brands',
method: 'GET',
params: postData
}).success(function(data) {
console.log(data);
});
Not working:
$http.get($rootScope.root + '/brands', postData).success(function(data) {
console.log(data);
$scope.brands = data;
});
The 2nd parameter for the $http.get shortcut method is meant to pass in parameters such as cache control, etc. Only for $http.post does the 2nd parameter accept the post data. If you are using the shortcut for $http.get you will need to pass in the query parameters as part of the URL: $http.get($rootScope.root + '/brands?a=1&b=2')
Ref: http://docs.angularjs.org/api/ng.$http#methods_get
Related
I want to pass my $scope.data as data in $http-request.
$scope.data is not empty!
$http({
method: 'PUT',
url: url,
data: $scope.data
})...
But when sending this request the data is empty.
Try this shortcut method
From Angular docs
Look under the Shortcut methods section here
$http.put(url, data, config)
.then(
function(response){
// success callback
},
function(response){
// failure callback
});
If you are using node.js make sure you have included body-parser module and access it by request.body
i have a factory in my app:
dashboard.factory('ProxyStatusFactory', ['$resource','CodisData', function ($resource,CodisData) {
return $resource('http://' + CodisData.Addr + '/api/proxy', {}, {
query:{ method: 'GET', url : 'http://' + CodisData.Addr + '/api/proxy/list', isArray: true },
setStatus:{ method: 'POST' }
});
}]);
the CodisData is a angular value
dashboard.value("CodisData",{"Name":"NA","Addr":"NA"});
then i use it in my controller like this:
$scope.codis_name = selected.Tag;
$scope.codis_addr = selected.Addr;
CodisData.Addr = selected.Addr;
$scope.proxy_array = ProxyStatusFactory.query();
i changed CodisData.Addr ,but in ProxyStatusFactory ,$resource also return 'http://na/api/proxy'
so when CodisData change,how synchronized update ProxyStatusFactory and return correct $resource?
try this:
dashboard.factory('ProxyStatusFactory', ['$resource', function ($resource) {
return $resource('http://:addr/api/proxy/', {}, {
query: {
method: 'GET',
url: 'http://:addr/api/proxy/list',
params: {},
isArray: true
},
setStatus:{ method: 'POST' }
});
}]);
then use in controller like this:
ProxyStatusFactory.query({addr: CodisData.Addr});
Moving forward with explanation...
angular factory/service are singletons, so they are created only ONCE. So http url is also created only once, based on current value of CodisData.Addr.
Thats why + CodisData.Addr + is changed to :addr to make this part of url configurable....
I hope this helps :)
#update
tested on local project and injecting variables into url part, works as expected, but when desired url is external rest api then it fails with message you describe.
In that case You can dynamically create $resource object. Here is jsfiddle with working factory that creates resources dynamically.
https://jsfiddle.net/qwetty/mxrz2cxh/13/
What is type of data angular sending? I use laravel + angular. I`m trying, but this script return 405 error. Method not allowed.
.controller('adminCtrl', function( $scope, $http ){
$scope.collection = [];
$scope.newData = [];
$scope.newrecord = function() {
$scope.collection.push($scope.newData);
$http({
url: '/newrecord',
method: "POST",
data: $.param($scope.collection),
headers: {
'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
}
}).success(function(data){
console.log(data);
})
}
})
You are getting 405 - Method not Allowed because the server you are sending your request does not have POST it the white list of methods allowed to be used to perform requests to that given API.
It's not an angularJS issue, it's a server configuration issue.
$http sends data as json.
You do not need to serialize params using "$.param", data is plain javascript object, which is send to your REST endpoint.
So attach just "$scope.collection) and do not set Content Type manually, it is json by default.
POST can be send also with convenience method.
$http.post('/someUrl', data, config).then(successCallback, errorCallback);
I'm trying to use "angular-busy" and it breaks when I add the ['cgBusy'] to the angular module.
Can anyone see what's going wrong with this? I'm trying to show the loading spinner when data is fetched using the $http service:
$scope.promise = $http({
method: 'JSONP',
url: nprUrl + '&apiKey=' + apiKey + '&callback=JSON_CALLBACK'
}).success(function(data, status) {
alert('success');
// Store the list of stories on the scope
// from the NPR API response object (described above)
$scope.programs = data.list.story;
}).error(function(data, status) {
// Some error occurred
alert('fail');
});
Here's my plnker code:
http://plnkr.co/edit/wXHdMpiyhHSVTtncorYD?p=preview
Two things
You have to include angular-busy.js in the index.html
Your promise is called promise not myPromise
Working example :
http://plnkr.co/edit/PLCs4S3ih8eD4mQuZOAl?p=preview
I am using angularjs with slim php and I have a GET action in slim which
action/param1/param2
Then in my angularJS
$http({
url: 'action',
method: 'GET',
params:{param1: param1, param2: param2}
}).success();
It return error in console with using ? and &, but I need it get with slash between params
http://xxxxxx/action?param=aaa¶m2=bbb
What I have tried, I change the $http params to below and it works
url: 'action/' + param1 + '/' + param2
Ok, my question is, is there any better solution compare to mine? because I feel mine stupid.
Use $resource instead:
var myResource = $resource('action/:foo/:bar', {},
{ get: { method: 'GET' } }
);
myResource.get({foo:1, bar:2});
Will yield a call to:
http://yourserver.com/action/1/2