AngularJs - How to update Internal data within a Factory? - angularjs

I have a factory in my app which takes environment uri data as input parameter and returns a $resource object as below. The coreService is a singleton object used in many other controllers of UI. Initially, the app gets registered with default config environment values.Once the user logs in, an event is triggered which changes the environmentData object. Problem here is the coreService still holds the default environmentData values and doesn't take the updated environment data.
angular.module('mbapp.sm')
.factory('coreService', coreService);
coreService.$inject = ['$resource','environmentData'];
function coreService($resource,environmentData) {
return $resource(environmentData.getAppInfoURI(), null,
{
getAppInfo: {
method: 'GET',
headers: {
'Accept': 'application/json'
},
url: environmentData.getAppInfoURI() + "appInfo?appId=:appId"
},
getAllAppHistory: {
method: 'GET',
headers: {
'Accept': 'application/json'
},
url: environmentData.getHistoryURI() + "apps?history=Y&version=1"
},
});
The controller class calls the service as below -
coreService.getAppInfo({
appId: var }).$promise.then(appInfoSuccess, appInfoFailure);
Need help is figuring out a way to update the environmentData as the base uris change.
If environmentData.getAppInfoURI() returned "aaa" and later changes to "bbb", the coreService still holds "aaa" value of getAppInfoURI()

Related

Unable to send data to web api methods using angularjs

Hi I am developing one application using web api2 and angularjs. Finding hard time to send data to web api methods. I am having problem to send data as objects n PUT and POST methods. In delete and getbyid methods i am able to send single parameter but i am not able to send data as object. I am receiving null as below.
I am calling as below using angularjs.
this.saveSubscriber = function (sub) {
return $http({
method: 'post',
data: sub,
url: '/NCT_Users/',
// contentType: "application/json"
headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
});
}
If i comment header and uncomment contentType in above code I am getting totally null object as below.
May i know why i am not able to bind object to model? Any help would be appreciated. Thank you.
var person = {firstName:"John", lastName:"Doe", age:46};
$http.post('url', person)
.success(function (response){
alert(response);
});
accesstoken is defined variable.you can define your variables to pass it to server
var person = {
firstName:"John",
lastName:"Doe",
age:46
};
$http.post('url', person)
.success(function (response) {
alert(response);
});
try this way.
var sub = {
User_CreatedDate: "",
UserEmailId: "",
User_Id: "",
User_MobileNum: "",
User_Name: "",
User_Password: "",
User_Role: "",
User_Status: "",
User_UpdateDate: ""
};
$http.post('/NCT_Users/', sub).success(function (response) { alert(response); });
the fields are filled by you
It happens like this because you are sending an JS Object via an 'application/x-www-form-urlencoded' header. You have to send the data as parameters, try this updated function:
this.saveSubscriber = function (sub) {
return $http({
method: 'POST',
data: $.param(sub),
url: '/NCT_Users/',
headers : { 'Content-Type': 'application/x-www-form-urlencoded' }
});
}

POST a JSON array with ANGULARJS $resource

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

Posting to a REST interface

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);
});
});

AngularJs: init directive model with parameter from Url

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)

set default/additional payload in ngResource

I have following resource defined as a service named 'User':
return $resource('/user', {}, {
login: {
url: 'user/login',
method: 'PUT',
headers: {
'Content-Type': 'application/json',
'Accept': 'application/json'
}
}
});
and I can use it for logging in inside controller as follows:
User.login({
Password: $scope.password,
UserName: $scope.name,
OsModel: Os.model,
OsVersion: Os.version
});
(Os is another service providing some values).
the problem is that this resource is gonna be used in some other controllers too and I dont want to set irrelevant values like OsModel and OsVersion all around and inside different controllers, so the idea is to set those two values inside service where the resource has defined the login action to some default values so that they will be set inside payload body.
I have tried to use the params key but it sends those values as query parameters and does not add them to the request payload and I did not find anything else in angular docs. Is there any way to do so in angular?
I'm using the angular v 1.2.11.
ok I ended up using the transformRequest on the $resource definition, something like bellow:
return $resource('/user', {}, {
login: {
url: 'user/login',
method: 'PUT',
headers: {
'Content-Type': 'application/json',
'Accepts': 'application/json'
},
transformRequest: function(data) {
data.OsModel = Os.model;
data.OsVersion = Os.version;
return JSON.stringify(data);
}
}
});
not sure if thats the most elegant way but this is working for me.

Resources