Accessing DOM behind "if currentUser" after "onRendered" - best method?

Hey guys,
Here’s another question about accessing DOM elements after in the “onRendered” callback.

I’m finding that “Template.instance ().$(“div#welcome”);” is not finding “div#welcome” if its inside a “if currentUser” block. The DIV is found if its not inside the “if currentUser”. And I think I know why it doesn’t. I.e. because at “onRendered”, the view has not yet executed “if currentUser” for “div#welcome” to have been rendered.

My question is, how would I access “div#welcome” as soon as the page is rendered. I don’t want to use a timeout because that’s too inaccurate.

Here’s the code:

HTML (The square brackets are supposed to be normal angled-brackets.):


[Template name=“signedIn”]
{{if currentUser}}
[div id=“welcome”]WELCOME![/div]
{{else}}
[div][p]You’re not yet signed-in.[/p][/div]
{{/if}}
[/Template]

JS:


Template.signedIn.onRendered (function () {
var div = Template.instance ().$(“div#welcome”);
/animate the welcome message/
})

Wrap the part INSIDE #if as a separate template and use that child Template onRendered function.

And currentUser is not logged in after opening Meteor app in client normaly.
Try fast-render package. :smiley:

have fun

1 Like