diegopamio/angular-sails-bind

---

diegopamio/angular-sails-bind.json

{
  "createdAt": "2014-05-20T01:46:32Z",
  "defaultBranch": "master",
  "description": "An angular service to bind scope models to sailsjs models thru socket",
  "fullName": "diegopamio/angular-sails-bind",
  "homepage": "",
  "language": "JavaScript",
  "name": "angular-sails-bind",
  "pushedAt": "2016-06-21T13:22:59Z",
  "stargazersCount": 135,
  "topics": [],
  "updatedAt": "2025-08-27T11:24:05Z",
  "url": "https://github.com/diegopamio/angular-sails-bind"
}

Angular Sails Bind

An AngularJS service to bind Angular models with sailsjs backend models using socket.io.

Add it as a dependency to your angular app, and then bind any model IN JUST ONE LINE!!!!!

  $sailsBind.bind("<your model name here>", $scope);

how much it weights? It takes only 2073 bytes of pure javascript to add this magic to your angularjs project.

What it does:

• Creates the model inside the $scope for you.
• Retrieves the model data from the backend using socket.
• Watches for changes made by the user in the UI and updates the backend immediately.
• Watches for changes made in the backend and updates the UI immediately.

Installation:

bower install angular-sails-bind

Usage

A small example:

var app = angular.module("MyApp", ['ngSailsBind']);
app.controller("ItemsCtrl", function ($scope, $sailsBind) {
  // To easily add new items to the collection.
  $scope.newItem = {};
  /** This will:
  *     1. Add a "items" model to $scope. (pluralized)
  *     2. Get the data from your http://<examplesite.com>/item thru sailsjs socket get.
  *     3. Setup socket io so that, when something changes in the sailsjs backend, they will be reflected
  *        in the angular "items" model.
  *     4. Watch the "items" model for collection changes in angular (add and removal of items
  *        and send them to the backend using socket.
  **/
  $sailsBind.bind("item", $scope);

<div ng-controller="ItemsCtrl">
  <input ng-model="newItem.name"/><a href="" ng-click="items.push(newItem);newItem={}">Add New</a>
  <ul>
    <li ng-repeat="item in items">{{item.name}} <a href="" ng-click="items.splice(items.indexOf(item), 1)">remove</a></li>
  </ul>
</div>

Getting a subset of the model:

You can filter the initial model content by adding a third parameter to the $sailsBind function (thanks @Shalotelli for the request).

   $sailsBind.bind("item", $scope, {"name": {"contains": "Foo"}};

This third parameter is a json that follows the “where” clause syntax, as documented in sails’ find call: [http://beta.sailsjs.org/#!documentation/reference/Blueprints/FindRecords.html]!()