Two way data binding

[cyrixmorten]

So far I have managed to perform a query, auto generate getter/setters, expose the value of my object using the notation {{myObj.getName()}}.

This all works well but I would like to be able to edit the values of myObj, and so far I have not figured out an elegant way to do so.

I would imagine, if the attribute of the getter/setter was exposed, I would be able to use the ng-model notation ng-model="myObj.name".

This would of course not perfom any updates on the database side of parse but it would be rather trivial to implement a saveState() method, to persist the current state of myObj.

I feel like I am missing something and hope that you can point me in the right direction.

[spacenick]

Hey,

there is one big bummer with that backbone-ish structure which is setting data on a model using forms. If you want to do something super elegant, you'll have to get your hands dirty and write a low level directive (that works with ngModel) to directly use setters to your model.

I've started something here https://github.com/brandid/angular-backbone-bindings but it's not fully tested / not working with every input type (like dropdowns or so). It should be fine for a 'basic' use on input text, texarea and this kind of stuff.

You'd use it like:

<input type="text" ng-model="name" bb-model="myModel" />

And it'd basically do myModel.set('name', inputValue) under the hood. Please note that here you would use ng-model to define the name of the key you want to set on your model (here, myModel that needs to be available on the scope too)

Otherwise, you can use a good old proxy object like

$scope.formData = { }; 
<input type="text" ng-model="formData.name" />

And then do

myModel.set($scope.formData) // Set accepts an object as a parameter too

You can even listen to your proxy object changes to refresh realtime the data on your model

$scope.$watchCollection('formData', function(value) {
  $scope.myModel.set(value);
});

[cyrixmorten]

Thank you for the fast response

Will look into the backbone-bindings and see how it goes, no need for anything exotic yet so my guess is that it will cover my needs.

Thumbs up for an awesome piece of work 👍

Looking forward to see the updated parse-angular-demo when it is ready

[spacenick]

Thanks dude! Yeah if you feel it is behaving weird or anything just switch back to a classic JS object, we have few forms on getbrandid.com but we usually use that when dealing with forms.

Yes we should be updating it ASAP but we're pretty busy these days.. Classic!

[Niks-kohli007]

Thanks you for the useful information. Can you please give some examples of how to save form data in parse ?

[arcdev1]

You can take a look at my learning project for some CRUD examples, if you like. https://github.com/arcnovus/learning-parse-angular-patch

NB: I'm not in any way affiliated with BRANDiD or the parse-angular-patch project. I'm just a dev who's learning, like you.

[cyrixmorten]

I have also made this: https://github.com/cyrixmorten/parse-angular-crud-demo

Same disclaimer as arcdev1, including the fact that I have not commited recently due to some shortcommings of ng-table's ability to have dynamic column headers together with sorting and filtering.

My CRUD demo aims at CRUD-enabling Parse Objects with the least amount of work as possible. This boils down to:

• Define the model of the Parse object in the factory in services.js
• Add deviations, such as hidden data (ACL, pointer to owner, etc..) in your controller in controllers.js
• Create the view

The demo includes examples of all that but is, as mentioned, highly work in progress.

Perhaps I will commit later today even though missing the translations of column headers, cause quite a lot has happened since my last commit. Let me know if you want me to do that :)