Home > front end >  i18n : translate a sentence that one of words is bold
i18n : translate a sentence that one of words is bold

Time:01-18

I want to translate this sentence in i18n

Select <b>branch(s)</b> you want to send selected product
after selecting Branch Click on submit

As you can see , one word in above sentence is in <b> tag.

I have this solution , But I am not sure is this is the best way to do or not.

$t('part1') <b>$t('part2')</b>  $t('part3')

so ,do you know better way to translate this ??

CodePudding user response:

As per your requirement, we have to translate a message/sentence which contains HTML tag.

The solution $t('part1') <b>$t('part2')</b> $t('part3') you mentioned in OP is difficult to manage and complicated. You can avoid it using the i18n functional component. For example :

Your language JSON will look like this :

const messages = {
  en: {
    info: 'Select {branchText} you want to send selected product after selecting Branch Click on submit.',
    subText: 'branch(s)',
  }
}

Template will look like this :

<i18n path="info" tag="p">
  <template v-slot:branchText>
    <b>{{ $t('subText') }}</b>
  </template>
</i18n>

Hope this answer will help! Thanks.

  •  Tags:  
  • Related