How to pass a URL to a collection in Backbone - backbone.js

Question

I need to build several collections in Backbone that only differ by their URL. Here is my model:
App.Models.Main = Backbone.Model.extend({});
Here is my collection:
App.Collections.Mains = Backbone.Collection.extend({
model: App.Models.Main,
initialize: function() {
this.fetch({
success: function(data) {
//console.log(data.models);
}
});
},
url: this.url
});
In my router, I tried:
mc = new App.Collections.Mains({ url: 'main-contact'});
mains = new App.Views.Mains({ collection: mc});
$('#web-leads').append(mains.el);
But I get an this error: Error: A "url" property or function must be specified
How do I pass the URL into the collection?

Answer 1

The Backbone.Collection constructor looks like this:
Backbone.Collection = function(models, options) { ...
It expects the options as a second argument. The first argument is a list of models with which to initialize the collection.
You need to initialize the collection with:
mc = new App.Collections.Mains(null, { url: 'main-contact'})
Also, when you're defining your collection you're not setting the url property correctly. The expression this.url is evaluated when your model is defined, not when it is initialized. The context of this does not point to any instance of the collection, but the scope at the time of defining the model, probably window. Javascript allows you to try to set it to window.url, but because window has no such property, it's set to undefined.
Instead of:
App.Collections.Mains = Backbone.Collection.extend({
url: this.url
});
You need to set the url in the initialize method:
App.Collections.Mains = Backbone.Collection.extend({
initialize: function(models, options) {
if(options && options.url) {
this.url = options.url;
}
}
});

Answer 2

This should work, it's a bit ugly though:
mc = new (App.Collections.Mains.extend({ url: 'main-contact'}));
mains = new App.Views.Mains({ collection: mc});
You basically extend your base collection and call a new on it. Unwrapping it would be something like:
MainContantCollection = App.Collections.Mains.extend({ url: 'main-contact'});
mc = new MainContactCollection();
mains = new App.Views.Mains({ collection: mc});