How to call function using Nunjucks?

Question

I want to call the jQuery function in HTML using Nunjucks, but it's giving me an error. I have imported the JS file into the HTML file.

Error: Unable to call 'fooName', which is undefined or falsey

Does anyone know why I can't call the function? Here is my code example:

<a class="btn" onclick="{{fooName(test)}}" href="#">Click me!</a>

$(document).ready(() => {
  const fooName = (name) => {
    console.log(`${this.name}`)
  };
});

Answer 1

My situation was a bit different but still I think it works in this case too

The idea is to add a function to the global window object

Within the view render method that passes variables to nunjucks I added this function

var self = this;

window.onClick = function (id) {
 // self.fetchData(id);
 // Do something
}

and within nunjucks

<a class="btn" onclick="window.onClick({{item.id}})">Click me!</a>

it works perfectly.