Use a handlebars helper within a partial tag

Question

I have a handlebars helper which allows me to translate strings into their supported locales:

{{getString "my-translatable-string"}}

function getString(id, args) {
  const supportedLocales = getSupportedLocales(args);
  return LocaleUtils.fluentFormat(supportedLocales, id, args.hash);
}

I want to pass that value to a handlebars partial

{{> mypartial alt="{{getString "my-translatable-string"}}"}}

but this throws errors. How do I pass/interpolate the result of "getString" into the alt parameter of the partial tag?

Answer 1

I see two issues:

First, by wrapping the value of alt in quotes it looks like we are trying to pass a literal string as the value of the alt parameter to our partial. However, we want to use a Handlebars expression, so those quotes should be removed.

Second, Handlebars will not allow us to nest mustaches. Instead, Handlebars will allow us to use subexpressions by wrapping the subexpression in parentheses.

The resulting template becomes:

{{> mypartial alt=(getString "my-translatable-string")}}

I have created a fiddle for your reference.