如何在 angular 的字符串文字中使文本加粗？

Question

您好，我正在处理 Angular 申请。我想将文本的某些部分设为粗体，那么如何在字符串文字中做到这一点。

这是.ts中的代码class:

   if (res.status== "200") {
    this.colortext = `${res.colorofthebus} color is the best of ${res.othercolor}`;
  }

这是.html:

{{colortext}}

如何将 res.colorofthebus 设置为粗体，而将其他设置为普通字体。

TIA。

Answer 1

使用 innerHTML。参考Documentation.

if (res.status== "200") {
    this.colortext = `<b>${res.colorofthebus}</b> color is the best of ${res.othercolor}`;
  }

...

<div [innerHTML]="colortext"></div>

Answer 2

一个可能的解决方案是使用 angular 的 innerHtml，像这样：

.ts

this.colortext = `<strong>${res.colorofthebus}</strong> color is the best of ${res.othercolor}`;

.html

<span [innerHTML]="colortext"></span>

Answer 3

html

<b>{{colortext?.colorofthebus}}</b> color is the best of {{colortext?.othercolor}}

.ts

this.colortext = res

如何在 angular 的字符串文字中使文本加粗？

How to make text bold in string literal in angular?

javascript

angular

angular6

angular8