How to pass the data to a template using blaze-layout render?

Question

I tried the following code to pass data to a template and receive it in onCreated() but I cannot access the data.

deviceInfo.js:
BlazeLayout.render('layout',{main:'deviceInfo',stats:'paramstats',attr:"SOME_DATA"});

deviceInfo.html:
{{>Template.dynamic template=stats data=attr}}

paramstats.js:
Template.paramstats.onCreated( () => {
    console.log("onCreated");
    console.log("Data is:",this.data.attr);
});

But I get TypeError: Cannot read property 'attr' of undefined. where am I going wrong?

Where do you call `console.log("Data is:", this.data.attr);`? please include the full code — kkkkkkk, Nov 28 '16 at 10:34
i am calling it in the oncreated of the paramstats template. — Murali Krishna, Nov 28 '16 at 12:57
In this instance it would be best to pull whatever data you need directly on the paramstats template. If you need something to tell you about the route, you can rely on FlowRouter.getParam() or FlowRouter.route which will tell you where you're at. Full code/more details will make this easier to answer :) — Ryan Glover, Nov 28 '16 at 13:34
I don't want to show the parameter in the url(for FlowRouter.getParam()) and i also don't want to route to a new page. So, i just want pass data to paramstats template(which is a child of deviceInfo template) from deviceInfo template. — Murali Krishna, Nov 28 '16 at 13:47

score 1 · Answer 1 · answered Nov 28 '16 at 13:43

1

You need to use the normal function syntax for onCreated callback. Arrow function will bind the context of your function to the outer scope automatically, it is the cause of your problem. Try this:

Template.paramstats.onCreated(function() {
    console.log("onCreated");
    console.log("Data is:",this.data.attr);
});

answered Nov 28 '16 at 13:43

kkkkkkk

7,628
2
18
31

I tried your code, but it didn't work. it says `TypeError: Cannot read property 'attr' of undefined.` – Murali Krishna Nov 28 '16 at 13:55
1

Try `console.log(this)` to see what it refers to – kkkkkkk Nov 28 '16 at 13:57
This is the best i could do. `Blaze.TemplateInstance {view: Blaze.View, data: undefined, firstNode: null, lastNode: null, _allSubsReadyDep: T…r.Dependency…}`. data is undefined. It refers to paramstats template. – Murali Krishna Nov 28 '16 at 14:02
1

Not sure what is happening to your code. These are something I notice: `firstNode` and `lastNode` is null, don't you have any elements inside your template? `data` is `undefined`, at least it should be the data of its parent unless you override it. Finally try `console.log(this.view.name)` to see if it is really your template – kkkkkkk Nov 28 '16 at 14:44
In onRendered() of deviceInfo.js I was not passing the `attr`. So it gave `attr` was undefined. Its a silly mistake, its working now. Thanks. – Murali Krishna Nov 29 '16 at 10:25

score 1 · Answer 2 · edited Apr 15 '18 at 17:27

1

I am using Meteor 1.4.# and I was able to retrieve the parameters like so:

BlazeLayout.render("page", { 
    params: ['fullscreen', 'route']
});

// page.js

Template.page.onCreated(function() {
    let params = this.data.params();
    console.log(params);
}

edited Apr 15 '18 at 17:27

marc_s

732,580
175
1,330
1,459

answered Jun 22 '17 at 19:11

ArmenB

2,125
3
23
47

score 0 · Answer 3 · answered Nov 28 '16 at 18:29

Not quite sure why you're using two levels of indirection. BlazeLayout.render() is giving you one level and then you're using a dynamic template within that? Why not directly render the template you ultimately want using BlazeLayout.render()?

In any case, you're dereferencing your data context indirectly.

In the BlazeLayout.render() call you're setting the attr variable to some value.

Then in your dynamic template you're using data=attr but this means that inside your template helpers that this is going be have the value of attr. There will be no data subkey added automatically.

You don't show the value that you're setting for attr so it's not even clear that you have an attr subkey in your attr variable, that would also be confusing to anyone else who ever tries to debug your code.

@khang is correct about not using the arrow function syntax in onCreated(), try:

Template.paramstats.onCreated(function(){
    console.log("onCreated");
    console.log("Data is:",this);
});

this should have whatever value you stuffed into attr in your BlazeLayout.render()

How to pass the data to a template using blaze-layout render?

3 Answers3