[SOLVED] [V2] How to call Template7 custom helper from component?

Questions
1

I have a custom Template7 helper registered in my main.js which I want to use in my component pages. However when I try to invoke the helper from the component template I get the following error:

VM2768:7 Uncaught (in promise) ReferenceError: Template7 is not defined
at eval (eval at compile (template7.esm.js:NaN), <anonymous>:7:422)
at new Framework7Component (component.js:71)
at Object.create (component.js:334)
at compile (router-class.js:825)
at router.xhrRequest.then (router-class.js:837)
at <anonymous>

Relevant part of main.js, where the helper is registered:

Template7.registerHelper('getLocalizedMessage', function(messageId) {
  return LocaleHelper.getMessage(messageId);
});

And the page template part where I’m trying to use it:
…

<div class="page-content login-screen-content">
   <div class="login-screen-title">{{getLocalizedMessage msg_loginscreen_page_title}}</div>
</div>

…

What’s wrong with my T7 helper?
The interesting thing is that other Template7 features (datacontext props, #if, #each, etc.) work on the very same component template.

I’m on F7 2.0.6.

Thanks in advance,
Bálint

2

Ok, issue is in the Template7, imported as ES module. I will fix it there, but in meanwhile as a solution just make it avaialble globally in your main.js:

import Template7 from 'template7';

window.Template7 = Template7;
1 Like
3

The above workaround works perfectly, thanks Vladimir! :slight_smile:
(I actually should’ve found it out myself…)

Cheers,
Bálint