javascript - Access variable in Backbone View from Backbone Router -

my router

var approuter = backbone.router.extend({         routes: {             ':*':'home',             'home' : 'home',             'home/:a' : 'home',             '*whatever' : '404'          },         home: function (a) {             document.title = sitetitle + ' - home';             homepage = new homepage;             homepage.render(a);         },         404: function(){             document.title = sitetitle + ' - 404';             fofpage = new fofpage;             fofpage.render();         }      }); 

my home view

var homepage = backbone.view.extend({         initialize: function (options) {             _.bindall(this, 'beforerender', 'render', 'afterrender');             var _this = this;             this.render = _.wrap(this.render, function (render) {                 _this.beforerender();                 render();                 _this.afterrender();                 return _this;             });         },          beforerender: function () {             console.log('beforerender');         },          el: $('#indexcontent'),          template: _.template(homehtml, {}),          render: function (a) {             (a == null) ? backbone.history.navigate('home'): backbone.history.navigate('home/' + a);             console.log('passed parameter ' + a);             this.$el.html(this.template);          },          afterrender: function () {             $('pre code').each(function (i, block) {                 hljs.highlightblock(block);             });             console.log('afterrender');         }     }); 

i trying catch variable a router view. shows undefined in console. tried fiddling variable options in initialize no luck. thanks

while found answer, explain why initial code wasn't working , more.

why passing render doesn't work?

because you're overriding render function in initialize function wrapped version, using underscore's wrap function.

it work, you'd need take parameter account when wrapping:

this.render = _.wrap(this.render, function(render, a) {     this.beforerender();     render.call(this, a); // here, pass argument     this.afterrender();     return this; }); 

also notice don't need var _this = this you're replacing member function , context applied automatically when called. same thing _.bindall useless here.

the easier way

that wrap thing unnecessary, it's complexifying homepage view without benefits or added features.

the thing you'd need:

var homepage = backbone.view.extend({     el: $('#indexcontent'), 

you can ignore options param (the {})

    template: _.template(homehtml),      initialize: function(options) { 

if want pass options initialize, use 1 of following patterns:

        this.options = options || {}; // make sure it's object. 

or, better, make sure it's copy of object, default values.

        this.options = _.extend({             route: "default-value"         }, options);     },      beforerender: function() {         console.log('beforerender');     },      render: function(route) {         this.beforerender(); 

do redirection in router, it's role.

        // (a == null) ? backbone.history.navigate('home'): backbone.history.navigate('home/' + a);          console.log('passed parameter ' + route || this.options.route); 

the underscore's _.template function returns function, need call it.

        this.$el.html(this.template());          this.afterrender();         return this;     },      afterrender: function() { 

avoid global jquery function , prefer scoping search view element , children this.$(selector).

        this.$('pre code').each(function(i, block) {             hljs.highlightblock(block);         });         console.log('afterrender');     } });