angular-sails-socket
v0.3.6
Published
Helpers to bind Angular to Sails' implementation of Socket.io
Downloads
8
Readme
Angular Sails Socket
Helpers to bind Angular with Sails' implemention of Socket.io. This includes wrapping of the "RESTful" Socket actions with an Angular promise.
This module depends on the sails.io.js
library generated by Sails. It will
throw an exception if the Sails library is not loaded before this module.
Wrapping Sails Sockets
The following actions have been wrapped in Angular style promises to ensure that
returns are processed in scope, negating the need for $scope.$apply()
sailsSocket.get
sailsSocket.post
sailsSocket.put
Before Angular Sails Sockets, a basic get
using sails.io.js
could look like:
io.socket.get('/widgets', function(data, response) {
$scope.widgets = data;
$scope.$apply();
});
Afterwards, the same call would look like:
sailsSocket.get('/widgets').then(function(data) {
$scope.widgets = data;
});
If a status code above 400
is returned, the promise is rejected and the
response can be handled or ignored in your controller depending on your needs.
We can actually simplify the above code even more, thanks to a few custom helpers that are included in the library. For example, the following code functions identical to the snippet above, but in a single line:
$scope.widgets = sailsSocket.populateMany('widgets');
Sails Socket Helpers and Bindings
The following custom helpers and bindings are available to take care of many common tasks involved in communicating between Angular and Sails via Sockets:
sailsSocket.populateOne
/sailsSocket.populateMany
This will automatically populate a scope variable with the data returned from
the socket request. populateOne
is used for a single variable or object while
populateMany
can be used for populating a collection of objects:
$scope.myWidget = sailsSocket.populateOne('widgets/1234');
$scope.widgets = sailsSocket.populateMany('widgets');
sailsSocket.sync
/sailsSocket.syncOne
/sailsSocket.syncMany
Listen to incoming Socket events and update the scope variable specified. Using
sync
, the provided scope variable will be checked and the appropriate
syncOne
or syncMany
helper will be called. Similar to the above, these are
used based on whether you are observing an object or collection of objects.
sailsSocket.sync($scope.myWidget, 'widget');
sailsSocket.editable
Instantiates an Angular $watch
on the provided variable. Any changes will
automatically post data back to the server over sockets. This includes the
csrfToken
which is required by Sails to authenticate the request. You must
provide an array of fields which will be considered editable.
sailsSocket.editable($scope, 'myWidget', ['name', 'serialNumber']);
The csrfToken
can be reached manually at $scope.$root.sailsSocket._csrf