Restangular how to build custom url - angularjs

with this code
RestangularProvider.setBaseUrl('http://localhost:8080/api/1');
var elements = Restangular.all('events');
elements.getList();
I can call the endpoint
http://localhost:8080/api/1/events
but how can manage the code to have
http://localhost:8080/api/1/events/around/me

You can use the following code, to get the events
var getEvents = Restangular.oneUrl('getEventAroundMe', 'http://localhost:8080/api/1/events/around/me');

Related

Calling nodeJS from angularJS function

I have one function which block one room from room list via ajax call here is function
$scope.blockThisRoom = function(room, index){
// ajax call an validation
}
I have setup nodeJs script
var http = require('http');
var url = require('url');
var fs = require('fs');
var server;
var io = require('socket.io').listen(server);
server = http.createServer(function(req, res){
var queryObject = url.parse(req.url,true).query;
console.log(queryObject)
}),
and it gives query object while I am doing testing.
My Problem
I want to call nodeJS script when $scope.blockThisRoom function is call but I am confuse how to call node function.... , should I include nodeJS script as we add other javascript files in my view
or
I call nodeJS file a via ajax calling like below is code
$scope.testController = function() {
var url = "http://localhost:8076?id=1&type=block";
$http.get(url).success( function(response) {
$scope.students = response;
});
}
Angular and node are differents : NodeJs is executed in server, and angular in client. So If you try to include node script and run it on client browser, It will just not work... The two are javascripts, but not linked by any ways: you can use angular on PHP projects, and you can use Node.js without angular. It is just the fact that the two technologies are powerful when used together...
Effectively, I suggest to use Ajax call, with parameters you want (use $http.post instead of $http.get if you want to send a long query, or if you want to send arrays or objects... because with node and Angular post, you can send/parse JSON strings!!)

What is the better way to add office 365 javascript api library to angular js project?

Officejs library can be used inside angular controller as following way by adding library reference https://appsforoffice.microsoft.com/lib/1.1/hosted/office.js to index page
function sendRequest() {
// Create a local variable that contains the mailbox.
var mailbox = Office.context.mailbox;
mailbox.makeEwsRequestAsync(getItemRequest(mailbox.item.itemId), callback);
}
function callback(asyncResult) {
var result = asyncResult.value;
var context = asyncResult.context;
// Process the returned response here.
}
is there any better way to handle these kind of libraries inside angular js project ?
Yeoman generater is there. it has option to create angular project
https://www.npmjs.com/package/generator-office

Issues with single-requests in Restangular

I'm having a slight issue with my ability to consume REST data retrieved via Restangular in an angular controller. I have the following code which works fine for a list of accounts:
var baseAccounts = Restangular.all('accounts');
baseAccounts.getList().then(function(accounts) {
$scope.accounts = accounts;
});
This works perfectly for a list. I use similar syntax for a single account:
var baseAccount = Restangular.one('accounts');
baseAccount.getList(GUID).then(function(returnedAccount) {
$scope.currentAccount = returnedAccount;
});
I am using ng-repeat as the handling directive for my first request. I am attempting to bind with {{ account.name }} tags for the single request, but it does not seem to display any data despite the request being made properly. GUID is the parameter I must pass in to retrieve the relevant record.
I have combed through Restangular docs and it seems to me like I am composing my request properly. Any insight would be greatly appreciated.
EDIT: I've tried all of the solutions listed here to no avail. It would seem Restangular is submitting the correctly structured request, but when it returns it through my controller it shows up as just a request for a list of accounts. When the response is logged, it shows the same response as would be expected for a list of accounts. I do not believe this is a scoping issue as I have encapsulated my request in a way that should work to mitigate that. So, there seems to be a disconnect between Request -> Restangular object/promise that populates the request -> data-binding to the request. Restangular alternates between returning the array of accounts or undefined.
Have you looked at:
https://github.com/mgonto/restangular#using-values-directly-in-templates
Since Angular 1.2, Promise unwrapping in templates has been disabled by default and will be deprecated soon.
Try:
$scope.accounts = baseAccounts.getList().$object;
try:
var baseAccount = Restangular.one('accounts', GUID);
baseAccount.get().then(function(returnedAccount) {
$scope.currentAccount = returnedAccount;
});
The problem here is that it's expecting an array to be returned. I'm assuming that you are expecting an account object. Thus we need to use the get function, intead of getList()
The one() function has a second argument that accepts an id e.g. .one('users', 1). You can take a use of it.
CODE
var baseAccount = Restangular.one('accounts', 1); //1 would be account id
baseAccount.getList('account').then(function(returnedAccount) {
$scope.currentAccount = returnedAccount;
});
OR
var baseAccount = Restangular.one('accounts', 1); //1 would be account id
baseAccount.all('account').getList().then(function(returnedAccount) {
$scope.currentAccount = returnedAccount;
});
For more info take look at github issue
Hope this could help you, Thanks.

Access Angular model instance from external JS?

My 'ProjectsCtrl' contains this function for adding a new project to a parent resource:
$scope.addProject = function(client){
$scope.client = client;
$scope.newProject.client_id = client.id;
project = Project.save($scope.newProject);
$scope.newProject = {};
}
The 'client' argument is taken from the view wherein I have an ng-submit="addProject(client)" within an ng-repeat="client in clients" block.
In another .js file I am trying to get reference to that client instance in order to update the view after pushing some data using server side events. Here is that code:
var pSource = new EventSource('/administration/projects/events');
pSource.addEventListener('projects.create', function(e){
var project = $.parseJSON(e.data);
var projectCtrl = angular.element($(".project-list")).scope();
projectCtrl.$apply(function(){
projectCtrl.client.projects.push(project);
});
});
The problem is that the project is always appended onto the first client instance, and not the one being passed to the addProject() function.
If I do client.projects.push(project); within the controller, then it works correctly. How can I get a reference to that client instance from outside of the controller?
The approach depends on the context:
If you are trying to update a model from another angular controller you can use angular services (angular services are basically singletons in the application) in order to have the same model reference
If you are trying to call a method from outside the angular scope you can either:
2.1. publish your controller function reference to a global namespace (not the best choice)
2.2. use any event dispatching mechanism and call $scope.apply(function() {manipulate your model }); on event listener
I ended up passing the $index of the parent resource as a model attribute on the child object and using that to push to the correct position.
e.g.
var clientCtrl = angular.element($(".client-list")).scope();
var project = $.parseJSON(e.data);
var projectCtrl = angular.element($(".project-list")).scope();
projectCtrl.$apply(function(){
clientCtrl.clients[project.client_ix].projects.push(project);
});

angularjs resource Authentication Header based on request body

I'm trying to use Resource with APIs protected by HMAC authentication methods. So I need to append "Authentication" header to the request.
In this example code I get the Article from the API with GET and update it with "update" custom method. For the update I need Authentication header. The problem is that $scope.article is undefined when I define the header.
getAuth function calculates the sign.
Suggestions?
function EditCtrl($scope,$resource,articleId) {
var Article = $resource('/blog/articles/:articleId',
{articleId:articleId}, {
update: {
method:'PUT',
headers: {Authentication: getAuth('key','PUT','/blog/articles/'+articleId,$scope.article)}
}
});
var article = Article.get();
$scope.article = article;
$scope.save = function(){
article.$update();
}
}
function getAuth(key,verb,resource,data) {
//data is undefined there
content_md5 = CryptoJS.MD5(JSON.stringify(data));
message = verb+'\n'+resource+'\n'+content_md5;
hash = CryptoJS.HmacSHA512(message, key);
var sign = "AuthHMAC 0123456789:"+hash.toString(CryptoJS.enc.Base64);
return sign;
}
I improve Alan's solution using three elements:
factory service that shares the key
controller that sends the httpRequest
httpRequestInterceptor that sets the header
The controller calls a setKey() provided by a factory service that calculates the header. Finally the httpResponseInterceptor sets the header of request calling getKey() provided by a factory service.
Solved!
I'm working on something similar right now.
I believe the answer lies in using $httpProvider.defaults.transformRequest functions, I don't have it complete yet, but the basics as described in the docs: http://docs.angularjs.org/api/ng.$http
I think are this:
var authModule = angular.module('my.AuthModule', [], myAuthModuleCfg);
function myAuthModuleCfg($httpProvider) {
$httpProvider.defaults.transformRequest.push(myRequestSigner)
}
function myRequestSigner(data, headersGetter) {
// do some signing, etc...
}
(Apologies for only posting a link instead of an entire solution) have a look at 'Monofraps's angular-node-hmac-example on GitHub (MIT license).
For Hmac/SHA512 encryption, it uses the (deprecated) CryptoJS library, which I'd probably swap for the Forge cryptographic library (CryptoJS has now been abandoned).
I have not tried it, but if you look at lower level API $http, it has a methods that take in config as a parameter. This config i think contains the headers property that you can update before making the request. Here is the signature for PUT
$http.put(url, data, config)

Resources