Внедрение параметров и HTML в ключ ngx-translate

Question

Возможно ли это?Скажем, у меня есть следующий текст, который я хочу перевести:

<p>You currently have <span class="bold">{{rewards?.points}}</span> points worth <span class="bold">{{rewards?.amount | currency}}</span> statement credit.</p>

Я хочу, чтобы этот текст был переводимым, но меня сбивают с толку две вещи - как вводить переменные количество баллов / количество и как сохранить жирный шрифттег span

Из моего файла en-US.json:

"statement": "You currently have {{points_param}} points worth {{credit_param}} statement credit."

Выполнение следующих работ, если я хочу использовать статическое значение для баллов / суммы, но это не сохраняет жирный шрифтстилизация или допустимое значение переменной.

<p [innerHTML]="'redeem.statement' | translate:{points_param:'50',credit_param:'100'}"></p>

Answer 1

Попробуйте этот код:

en-US.json файл:

"statement": "You currently have <span class='bold'>{{points_param}}</span> points worth <span class='bold'>{{credit_param}} </span> statement credit."

В компонентном HTML-файле:

<p [innerHTML]="'redeem.statement' | translate:{points_param:'50',credit_param:'100' | currency }"></p>

Убедитесь, что CSS добавлен для класса span bold.