this.options not available in view after rendering from server

[liberty-rowland]

Summary

When navigating to a route on the client side, I have this.options available within the view on the client side. However, when the route is loaded directly and rendered on the server I have access to the object on the server side but lose it client side.

Example:

controllers/test_controller

App.fetch(spec, function(err, result) {
  callback(err, {
    foo: 'bar'
  });
});

views/test

preRender: function() {
  console.log(this.options.foo);
},
events: {
  'click button' : 'preRender'
}

Loaded indirectly

If I load / and navigate to /test on the front-end, this console.log will output to my browser's console:

bar

Then when I click the button, this console.log will output to my browser's console:

bar

Loaded directly

If I navigate to /test directly in my browser, this console will output to my NodeJS console:

bar

However, clicking the button will now output the following error to my browser's console:

Uncaught TypeError: Cannot read property 'foo' of undefined

Question

Is there another way to reliably have access to the object passed into the handlebars template from the controller?

[saponifi3d]

Thanks for reporting - one way I've been getting around this is to have getTemplateData in the base view apply the options.

// views/base.js
var RendrView = require('rendr/shared/base/view');

module.exports = RendrView.extend({

  // NOTE: you can run into problems if an attribute on a model is the same as the option passed in
  getTemplateData: function () {
    var data = RendrView.prototype.apply(this, arguments)
    return _.extend(data, this.options)
  }
})

I'll look into seeing if there is anyway we can get around having to do that.

[demircancelebi]

Thanks for reporting. I also had the same issue and tried to solve like @saponifi3d did. I also addressed a similar issue here: #399. Rendr is really good but these bugs are so annoying.

[saponifi3d]

If you are getting data from a fetch call - there needs to be a model / collection as it's set in the store - otherwise it needs to be created at the view level and passed in via the template itself or getTemplateData

[saponifi3d]

so i think this PR fixes this issue: #403
however, it requires an update with: rendrjs/rendr-handlebars#26 as well.

I'm still trying to figure out how i might be able to lock down that PR given a specific version of Rendr. However, if you are using master of rendr + that rendr-handlebars code it will only call initialize once and all of the options are passed through to that view. (it also fixes problems with listenTos in the initialize function)