Understanding automatic model-view data binding
Whenever an attribute of the attached model changes, we refresh the view to display the updated data. A change
event listener is attached to the model inside the initialize()
method of the view as follows:
this.listenTo(this.model, 'change', this.render);
However, there are options that can handle this data binding automatically and you do not need to take care of it for every model-view relationship. This principle is more aligned towards the MVVM design pattern than the Backbone's MV* pattern, and you will find it in frameworks such as Knockout.js
and Meteor.js
.
For Backbone, there are multiple plugins such as Backbone.Stickit
(http://nytimes.github.io/backbone.stickit/), Backbone.ModelBinder
(https://github.com/theironcook/Backbone.ModelBinder), and Rivets.js
(http://www.rivetsjs.com/). These plugins provide a similar data binding feature. We are not going to discuss each plugin here; however, the implementation process is simple and similar...