In my controller I have this code to make request to my factory:
UploadService.news.save
data: angular.toJson $scope.data
file: $scope.file[0]
, ( (response) ->
#$scope.alert = ''
alert response.data
)
This will go to my factory:
app.factory "UploadService", ["$resource", ($resource) ->
news: $resource("upload/news",
headers:
'Content-Type': false
transformRequest: (data) ->
fd = new FormData()
fd.append 'data', data.data
fd.append 'file', data.file
fd
)
member: $resource("404/upload/member")
]
Problem is at transformRequest the data parameter is undefined, what is wrong with that? (I'm using Angular 1.2.3)
The way you declare your resource has several errors:
The $resource second argument is an hashmap for default parameter values
The third parameter contains actions (ie methods) for this resource. If you want to override the save action, you need to give its name.
Here is a working jsFiddle (Open your dev console, and then run)
app.factory "UploadService", ["$resource", ($resource) ->
news: $resource("upload/news", {}, # the missing second parameter
save: # You want to override the save action
method: 'POST' # it's an override, not an extend: need to set the method
headers:
'Content-Type': false
transformRequest: (data) ->
console.log data # data is now defined
return
)
member: ...
]
Or see the official doc
Related
I need to do send a json array to a restful api from my angularjs application. I am using ngresources to do this.
Since now, I have been abled to post and put single object with no problem, but now I need to send an array of objects and I can't.
I tried to do the call from a external rest application and it works fine but it's impossible from my angular application. I have trie to parse the objet with JSON.stringify but stills not working. I set the header 'Content-Type': 'application/json', as well on the $resources.
This is how I do the negresource:
.factory('AddSignosClinicos', function ($resource) {
return $resource(dondeapuntar + "/Rest/Pacientedatossignosclinicos.svc/pACIENTEDATOSSIGNOSCLINICOSList/Add", {}, {
create: { method: "POST", headers: { 'Content-Type': 'application/json', params: {} } }
});
})
And this is how I call the function:
var objeto = JSON.stringify(SignosClinicosGuardar);
var signosClinicosService = new AddSignosClinicos(objeto);
signosClinicosService.$create().then(function () {});
I made a console.log of objeto, and is a proper json array.
Any idea?
Thank you very much
EDIT
I have tried $http component for the post request, and it worked! I don´t understand why is not working with ngResources, this is my code for $http:
$http({
url: 'http://localhost:1046/Rest/Pacientedatossignosclinicos.svc/pACIENTEDATOSSIGNOSCLINICOSList/Add',
method: "POST",
data: SignosClinicosGuardar,
headers: {
'Content-Type': 'application/json; charset=UTF-8'
}
});
To post an array of objects you'll need to add the option isArray: true to your $resource:
.factory('AddSignosClinicos', function ($resource) {
return $resource(
"url-string-here",
{},
{
create: {
method: "POST",
isArray: true
}
}
);
})
Calling the new create function would look something like this:
//some list of your object instances
var array_of_objects = ...
var saved_objects = AddSignosClinicos.create(
array_of_objects
);
saved_objects.$promise.then(function() {
...
});
Note, the create vs $create, there's no $.
See the Angular documentation on $resource
need to define the name as ID in the URL and need to post an object containing data.
$scope.dvModel.naam is the name that acts as the ID.
filteredObject is the object containing the data, obviously.
This is how I call the service, seems ok according to some examples.
saveDVservice.query($scope.dvModel.naam, filteredObject);
This is the actual service.
.factory('saveDVservice', ['$resource', 'CONSTANTS', function($resource, CONSTANTS) {
'use strict';
return $resource(CONSTANTS.REST_BASE_URL + '/dv/:name', {}, { query: { method: 'POST', isArray: false, headers: { 'Content-Type': 'application/json' }}});
}]);
This is what I see in my network tab at Query String Parameters:
0:A
1:D
10:n
11:h
12:i
13:l
14:f
15:e
2:A
3:C
4:
5:P
6:a
7:n
8:n
9:e
Which is the name, but looks like an array.
Request Payload contains the actual object in correct order.
Can one give me some guidance on how to handle this?
As I understand, you want to put $scope.dvModel.naam into URL and you want filteredObject to be a request payload. Then you need an object that contains everything that's in filteredObject and additionaly under the key name a value equal to $scope.dvModel.naam.
Also, the definition of your resource probably should change - in second argument $resource requires you to tell it the way of extracting URL data from given object:
$resource(CONSTANTS.REST_BASE_URL + '/dv/:name', {name: '#name'}, { query: { method: 'POST', isArray: false, headers: { 'Content-Type': 'application/json' }}});
Unfortunately, $resource isn't the best $http wrapper to use when your payload data is separated from URL data. Maybe it would be better to wrap the filteredObject data in payload in some other object? Then your $resource object would be much nicer, like {name: ..., data: {"0": "A", "1": "D", ...}}
Since default action for query is {method: 'GET', isArray: true}, I'd leave that be and use another default, save instead. That should work out-of-the-box.
app.factory('DVService', function ($resource) {
return $resource(CONSTANTS.REST_BASE_URL + '/dv', {name: '#name'}, {});
});
.
app.controller('MainCtrl', function ($scope, DVService) {
var postData = {
name: 'name',
fooProp: 'foo',
barProp: 'bar'
};
// save/post
DVservice.save({dv: postData}).$promise.then(function (response) {
console.log(response);
});
//query/get
DVService.query({name: 'name'}).$promise.then(function (response) {
console.log(response);
});
});
I have several instances of specific directive like that:
<type="text" my-directive ng-model="formData.property1">
<type="text" my-directive ng-model="formData.property2">
formData.propery is an object like { name: '', code: '' }. formData.propery.name is used in view layer and formData.propery.code is sent to the server as value.
I want to init these directives from URL parameters - pass codes and get whole object as model value.
The difficulties here are:
I can't call function in directive scope that gets object from server with specific code, because it violates separation of concerns of parent scope and directive scope.
I can't init models from parent scope because of asyncronous call type of $http request.
I can't use specific init function in directive that gets object from server by model variable name because it a bit awkward and mess the code.
So what is proper way to do that?
Example 1:
getObj1 = (code)->
$http({
url: '/api/service/GetByCode'
method: 'POST'
data: { code: code }
headers: {'Content-Type': 'application/json; charset=utf-8'}
})
.success((data)->
$scope.formData.property1 = angular.fromJson(data.result)
)
getObj2 = (code)->
$http({
url: '/api/service/GetByCode'
method: 'POST'
data: { code: code }
headers: {'Content-Type': 'application/json; charset=utf-8'}
})
.success((data)->
$scope.formData.property2 = angular.fromJson(data.result)
)
Well, I've just needed to pass property to assign as argument to function using closure:
getObj = (code, prop)->
theProp = prop
$http({
url: '/api/service/GetByCode'
method: 'POST'
data: { code: code }
headers: {'Content-Type': 'application/json; charset=utf-8'}
})
.success((data)->
theProp = angular.fromJson(data.result)
)
and then call it like this:
getObj(someCode1, scope.formData.property1)
getObj(someCode2, scope.formData.property2)
Given:
Users = $resource apiUrl+"/v1/users/?offset=:offset&limit=:limit&format=json", {},
getNext:
method: 'GET'
Users.getNext { offset:20, limit:20 }, (data)->
console.log "got some data"
Instead of explicitly passing offset and limit, I'd like to pass current set and in transformRequest function extract limit and offset and set those parameters for the http call. How can I do it?
Doing something like that not working:
Users = $resource apiUrl+"/v1/users/?offset=:offset&limit=:limit&format=json", {},
getNext:
transformRequest: transformReq(data)
transformReq = (data)->
console.log "data == "+data
and even this doesn't:
transformReq = (data)->
[
(data) ->
console.log "data =="+data # undefined
]
it will intercept the transformReq when use the POST method, I am looking for the way the deal with the req too.
How fix Error:
[$resource:badcfg] Error in resource configuration. Expected response
to contain an array but got an object?
// Service
angular.module('admin.services', ['ngResource'])
// GET TASK LIST ACTIVITY
.factory('getTaskService', function($resource) {
return $resource('../rest/api.php?method=getTask&q=*',{ 'get': {method:'GET'}});
})
// Controller
$scope.getTask = getTaskService.query(function (response) {
angular.forEach(response, function (item) {
if (item.numFound > 0) {
for(var i = 0; i < item.numFound; i++) {
$scope.getTasks[i] = item.docs[i];
}
}
});
});
Also, if your service is sending an object instead of an array add isArray:false to its declaration.
'query': {method: 'GET', isArray: false }
$resource("../rest/api"}).get();
returns an object.
$resource("../rest/api").query();
returns an array.
You must use :
return $resource('../rest/api.php?method=getTask&q=*').query();
First of all you should configure $resource in different manner: without query params in the URL. Default query parameters may be passed as properties of the second parameter in resource(url, paramDefaults, actions). It is also to be mentioned that you configure get method of resource and using query instead.
Service
angular.module('admin.services', ['ngResource'])
// GET TASK LIST ACTIVITY
.factory('getTaskService', function($resource) {
return $resource(
'../rest/api.php',
{ method: 'getTask', q: '*' }, // Query parameters
{'query': { method: 'GET' }}
);
})
Documentation
http://docs.angularjs.org/api/ngResource.$resource
In order to handle arrays with the $resource service, it's suggested that you use the query method. As you can see below, the query method is built to handle arrays.
{ 'get': {method:'GET'},
'save': {method:'POST'},
'query': {method:'GET', isArray:true},
'remove': {method:'DELETE'},
'delete': {method:'DELETE'}
};
User $resource("apiUrl").query();
Make sure you are sending the proper parameters too. This happened to me after switching to UI-Router.
To fix it, I changed $routeParams to use $stateParams in my controller. The main issue was that $stateParams was no longer sending a proper parameter to the resource.
For anyone coming here in 2021, another way this request may look is as follows (at least it was in our app)
angular.module('load').factory('StateService', ['$resource', 'store', function($resource, store) {
return $resource('/some/url', {}, {
fetchAllStateCodes: {
method: 'GET',
isArray: true, // Response is an array of objects
headers: {
"Authorization": "Bearer " + store.get("jwt"),
"Content-type": "application/json"
}
}
});
}]);
From all of the good answers, it still wasn't obvious to me as to where to put the isArray flag...