Jeremy Plack
Jeremy Plack

Reputation: 487

Meteor Template Rendered in a package

Is it possible to do something like this:

  Template.hello.rendered = function() {
    $("#timepicker-default").timepicker();
  };

Inside of a package, independent of the actual template name.

Ignoring any other issues with the above pseudocode, what I'm wondering is how can I select DOM elements from within a package. Is it possible to write a package that can find the input element with data-attribute or a class of timepicker and generate the above code inserting the id of that element?

So you could write your markup like

<input id="mytimepicker" type="text" data-timepicker="default">

And the package would handle the rest.

Upvotes: 0

Views: 326

Answers (1)

David Weldon
David Weldon

Reputation: 64342

I think the fastest solution is to use the template-extension package. You'll get access to an onRendered hook which will fire every time any template in your app is rendered.

$ meteor add aldeed:template-extension

Template.onRendered(function () {
  this.$('input[data-timepicker]').timepicker();
});

Place the above anywhere in your client directory and it should select all all inputs in the template being rendered where the data-timepicker attribute is set.

If you need to use this in a package, just add api.use('aldeed:template-extension'); in your package.js.

Upvotes: 1

Related Questions