Introduction to Marionette.js – The Backbone Framework/

...

/

Moving Contacts to the Entities Module

Moving Contacts to the Entities Module

Learn how to create a separate file for our contact management in Marionette and how to request the contacts from the file.

We'll cover the following...

Moving the contact entities

Now that we have a better understanding of modules, let’s move our contacts from index.html into the contacts module:

Press + to interact
ContactManager.module("Entities", function(Entities, ContactManager,
Backbone, Marionette, $, _){
  Entities.Contact = Backbone.Model.extend({});
  Entities.ContactCollection = Backbone.Collection.extend({
    model: Entities.Contact,
    comparator: "firstName"
   }); 
});

Note: We’ve attached our model and collection as attributes to the module, and not the application, as was the case before. In other words, we’ve gone from using ContactManager.Contact to access contacts to using Entities.Contact for accessing them. Since we’re attaching them to the module, they will be publicly accessible. This means we can access them from elsewhere in the application, if necessary.

Since we’ve changed where our contact definitions are, we need to adapt our index.html file:

var contacts = new ContactManager.Entities.ContactCollection([  
    // our contact data goes here
]);
Updating the contact collection definition in index.html

Note we’ve simply changed: ContactManager.ContactCollection to ...