Users

{{ user.name }}

angular.module('firebase-example', ['js-data'])
  .config(function (DSFirebaseAdapterProvider) {
    var basePath = 'https://js-data-firebase.firebaseio.com';
    DSFirebaseAdapterProvider.defaults.basePath = basePath;
  })
  .run(function (DS, DSFirebaseAdapter, User) {

    // js-data-angular created a new store
    // automatically and registered it as DS.
    // The firebase adapter was already registered,
    // but we want to make it the default.
    DS.registerAdapter(
      'firebase',
      DSFirebaseAdapter,
      { default: true }
    );

    // Activate a mostly auto-sync with Firebase
    // The only thing missing is auto-sync TO Firebase
    // This will be easier with js-data 2.x, but right
    // now you still have to do DS.update('user', 1, { foo: 'bar' }), etc.
    angular.forEach(DS.definitions, function (Resource) {
      var ref = DSFirebaseAdapter.ref.child(Resource.endpoint);
      // Inject items into the store when they're added to Firebase
      // Update items in the store when they're modified in Firebase
      ref.on('child_changed', function (dataSnapshot) {
        var data = dataSnapshot.val();
        if (data[Resource.idAttribute]) {
          Resource.inject(data);
        }
      });
      // Eject items from the store when they're removed from Firebase
      ref.on('child_removed', function (dataSnapshot) {
        var data = dataSnapshot.val();
        if (data[Resource.idAttribute]) {
          Resource.eject(data[Resource.idAttribute]);
        }
      });
    });
  })
  .factory('User', function (DS) {
    return DS.defineResource('user');
  })
  .controller('firebaseCtrl', function ($scope, User) {
    var fCtrl = this;

    // Pull the initial list of users
    // from Firebase
    User.findAll();

    // Update the list of users on the
    // scope whenever the collection
    // changes
    User.bindAll({}, $scope, 'users');

    $scope.add = function (user) {
      // Create a new user in Firebase
      return User.create(user).then(function () {
        fCtrl.name = '';
      });
    };

    $scope.remove = function (user) {
      // Destroy a user from firebase
      return User.destroy(user.id);
    };
  });

<div class="list-group">
  <div class="list-group-item" data-ng-repeat="user in users track by user.id">
    <div class="pull-right">
      <button class="btn btn-xs btn-danger" data-ng-click="remove(user)">
        Delete
      </button>
    </div>
    {{ user.name }}
  </div>
  <div class="list-group-item">
    <form id="user-form" name="user-form" data-ng-submit="add({ name: fCtrl.name })">

      <input class="form-control" type="text" data-ng-model="fCtrl.name" id="name" name="name"
             placeholder="Enter a name and press enter"/>
      <input type="submit" class="hidden"/>
    </form>
  </div>
</div>