I am trying Marionette for the first time and am very much confused about its routing.
Here's what I have so far: a Backbone model, a Backbone collection, a Marionette Layout view, a Marionette Collection View, a couple of Marionette Item views. The views are hooked together in a Marionette object like so:
var Orchestrator = Marionette.Object.extend({
initialize: function(layout) {
this.layout = layout;
// adding a collection view
// showing the collection view in the layout view
// all is honky-dory
},
// And here is a test function I want to call when I go to localhost:8080/#test:
test: function() {
console.log('HELLOOO!!!');
}
});
And here comes the confusion. I am trying to set up the router:
var Router = Marionette.AppRouter.extend({
initialize: function(controller) {
// the 'controller' is an instance of my Orchestrator object defined above
this.controller = controller;
console.log(this.controller.test); // the method shows up correctly
this.appRoutes = {
'test': 'test'
};
}
});
Then I initialize the Router: var router = new Router(orchestrator); and start the Marionette app.
The console.log statement in the router shows that 1) it is being initialized, 2) the 'controller' is the correct Marionette object, and 3) the 'controller' has the method test on it.
However, when I navigate to localhost:8080/#test (my app is served at localhost:8080), I do not see any evidence that the test method of the Orchestrator object has been called — my 'HELLO' message does not appear in the console. There are no errors in the console either.
Could you please suggest what the matter might be and how to fix this? I've been searching through docs, but have not found any answers so far.
