Search code examples
vue.jsvue-i18n

Add custom character after i18 translation Vue

So, I'm having an issue adding custom characters after a translated word using i18n. To be more precise, this is the case :

<v-text-field
  v-bind:placeholder="$t('wordCapitalTitle')"
/>

In the above form, the translation works perfectly, I get the 'Title' placeholder value, which is correct.

But what I'm trying to do, is to be able to add extra characters, that doesn't affect the initial translation.

For example, instead of 'Title', I want the placeholder value to be 'Title*', but I cannot find a way to properly add the '*'.

I tried escaping the character using the unicode value, but if I do that, instead of 'Title*', I get 'wordCapitalTitle*'.

Can anyone give me a hint what should I do in order to make this possbile? Thanks alot!

Solution

  • Just use the string template syntax with backticks :

    <v-text-field
  v-bind:placeholder="`${$t('wordCapitalTitle')}*`"
/>