mcwebb / angular-parse-patch

Seamless patch for Parse JS SDK to work natively with AngularJS
Other
5 stars 2 forks source link

Mcwebb Angular Parse Patch

Based on the brilliant Parse Angular Patch. Adjusted to make more Angularic.

Installation

Install with Bower

# from the terminal at the root of your project
bower install angular-parse-patch --save

Add to your module deps

angular.module('xxxx', ['mcwebb.parse-patch'])

Example Use

Set up

angular.module('xxxx')
.config(function (ngParseProvider) {
  ngParseProvider.initialize(
    'YOUR_API_ID',
    'YOUR_JS_KEY'
  );
});

Basic Use

When creating a Parse object you must define the fields you want to be able to access without getters/setters.

angular.module('xxxx')
.controller('myController', function (ngParse, $scope) {
  var Cat = ngParse.Object.extend('Cat', {
    fields: [
      'name',
      'colour',
      'breed'
    ]
  });
  $scope.cat = new Cat();
});

Advanced Use

Adding instance methods (like purr below) is of course completly optional. However if you need to define some initialization logic, be sure to call the parent method, otherwise you won't get all the Angularic field goodness.

angular.module('xxxx')
.controller('myController', function (ngParse, $scope) {
  var Cat = ngParse.Object.extend('Cat', {
    fields: [
      'name',
      'colour',
      'breed'
    ],
    initialize: function () {
      // call the parent to bind those fields
      ngParse.Object.prototype.initialize.apply(this, arguments);
      // custom logic
      if (typeof this.breed == 'undefined')
        this.breed = [];
    },
    purr: function () {
      console.log(this.name  + ' is happy!');
    }
  });
  $scope.cat = new Cat();
});
<input type="text" ng-model="cat.name" />
<button ng-click="cat.purr()">Make me purr</button>

Events

Angular Parse Patch doesn't use $http on the backend so registering interceptors won't work for Parse calls. To get around this Angular Parse Patch will rootScope broadcast 'parse:transfer:start' and 'parse:transfer:end'.