Marionette.js. View. Listening Model and Collection events

If your view has a model and collection attached, it will listen for events on both

by marionettejs

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.2/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.3.3/backbone-min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.radio/2.0.0/backbone.radio.min.js"></script>
<script src="https://rawgit.com/marionettejs/backbone.marionette/next/lib/backbone.marionette.js"></script>

JavaScript

const { View } = Marionette; // import { View } from 'backbone.marionette';

const MyModel = Backbone.Model.extend();
const MyCollection = Backbone.Collection.extend({
	model: MyModel
});

const myCollection = new MyCollection([
	{title: 'Backbone.js'}, 
  {title: 'Marionette.js'}
]);

const myModel = new MyModel();

const MyView = View.extend({
  modelEvents: {
    'change:title': 'handleChangeAttr'
  },
  collectionEvents: {
    'update': 'handleCollectionUpdate'
  },
  
  handleChangeAttr() {
    console.log('title was changed');
  },
  handleCollectionUpdate() {
    console.log('models were added or removed in the collection');
  }
});

const myView = new MyView({
  model: myModel,
	collection: myCollection
});

myModel.set({'title': 'Backbone.Radio.js'});
myCollection.add(myModel);