using registerHelper for onclick but function executes on page render

Question

I'm using handlebars and I'm trying to pass in a function, but this function executes on page load instead of onclick, so trying to see what's wrong

So this is the js code

handlebars.registerHelper("randomOperation", () => {
      randomFile.functionCall()
})

Now on handlebar side, this is the code:

<a href="/newURL" target="_blank" onclick={{randomOperation}}>

Answer 1

You will not be able to use a Handlebars Custom Helper as an onclick event handler. These two types of functions execute at very different times.

The Handlebars helper is executed when the template is rendered - ie., when the template function is turning a string of template into a string of HTML. The helper is called so as to affect the rendered output. For example, an uppercase helper might uppercase some string values that are passed to it in the template.

The onclick is executed in response to a click event on the element by the user. Handlebars has spit-out its HTML and that HTML has been parsed and added to the HTML document before it becomes a clickable.

Therefore, in order to add an onclick handler, you will need to define that function globally in your client-side JavaScript. It has nothing to do with Handlebars and is not affected by the templating language you are using to create your HTML.