html - 文本区域中的 Angular 2 多种字体颜色

标签 html css angular typescript

我有一个文本区域,其中绑定(bind)了一个字符串。文本颜色默认为白色。

<textarea style="background-color: black;color:#fff;" [(ngModel)]="outputText"></textarea>

绑定(bind)的字符串包含多个变量。

return this.outputText = this.test1 + " test1Stat" + this.test2 + " test2Stat" + this.test3 + " test3Stat";

我想要做的是,如果 test1 小于 1,它应该以红色显示“test1 test1Stat”,而其他所有内容均为绿色。有办法做到这一点吗?

最佳答案

无法为文本区域中的部分文本着色, 但是,您可以尝试改用“contenteditable”属性。

它基本上把你的 div 变成一个文本框,你可以在里面使用 html 标签等。

.greenText{
color:green;}

div{
border:black solid 1px;
padding:20px;
}
    <div contenteditable="true">text text <span class='greenText'>GREEN TEXT</span> more text that you can edit</div>

关于html - 文本区域中的 Angular 2 多种字体颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44373933/

相关文章:

css - 一次压缩多个 css 和 js 文件

javascript - es6-module-loader 无法在 Angular 6 中找到 @angular/core

javascript - Angular 8 - 尝试比较 '[object Object]' 时出错。仅允许数组和可迭代对象

html - Glyphicon 和 Button Text 应该并排放置

javascript - 如何使用 jQuery 更改 Bootstrap 按钮属性

html - 嵌入式网络/应用服务器

css - Angular Material 2 mat-slide-toggle 改变拇指的滑动距离

css - 安全性 - 通过 http 或 https 的 css 文件

angular - 在 Angular 2 : Cannot find name 'Papa' 中使用 Papaparse

javascript - 按钮 onclick 显示 id 和值未定义