FormattedHTMLMessage component to display text with dynamic values along with other HTML elements to create emphasis on a piece of text.

FormattedMessage component instead, and wrap that component with HTML markup.

For example we have the translation data as such:

  'en-US': {
    detail: {
      window: '<small><em>All {numMerchants} links open in a new window.</em></small>',
    }
}

It is a embbed HTML.

To use it we need to import ‘FormattedHTMLMessage’:

<FormattedHTMLMessage id="detail.window" values={{numMerchants: book.merchants.length}} />