如何在Angular 2中将字符串的特定部分加粗 [英] How to make specific part of a string bold in Angular 2

问题描述

我有一个如下的HTML代码:

I have an HTML code as below:

<div class="row">
      <div class="col-12" style="margin-top:15px;margin-bottom:10px">
            {{"description" | translate}}
      </div>
</div>

我正在使用ngTranslate来翻译说明.描述是我翻译文件中的一个键，并且该键的值将显示.

I am using ngTranslate to translate the description. The description is a key from my translation file, and the value of the key will be displayed.

说明将如下所示:单击取消以取消或单击确认以继续".

The description will look like as below: "click cancel to cancel or click confirm to proceed".

我要进行第一次取消并在说明中确认为粗体.如何使用CSS和angular 2做到这一点?

I want to make the first cancel and confirm in the description to bold. How can I do that using css and angular 2?

推荐答案

您应使用[innerHTML]，在翻译中使用html标记，如下所示:

You should make use of [innerHTML], have html tags within your translations like this:

{
    "description": "click <strong>cancel</strong> to cancel or click <strong>confirm</strong> to proceed"
}

然后在模板中将其绑定为html字符串:

And in template bind it as html string:

<div [innerHTML]="'description' | translate"></div>

请检查> 官方文档

更新:> 工作柱塞示例

这篇关于如何在Angular 2中将字符串的特定部分加粗的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！