css - 如何根据字符长度> 128的条件应用css类

Question

这是角度应用程序，我想根据变量的字符长度大于 128 字符的条件应用 css 类。我受到这篇文章的启发，请在此处输入链接描述。如下面的代码片段所示，我正在尝试根据 charlen 值在 128 以内或以外的条件动态应用样式。请我是 Angular 的新手，我不知道许多概念，谢谢你的建议。

模板.html

<input [ngClass] = "(charlen <128)?'class1':'class2' />

模板.ts

str:String;
charlen:Number;

ngInit () {
 str="this is not 128 char";
 charlen = str.length;
}

模板.css

.class1 {
color:red;
}

.class2 {
 color:blue;
}

标签： cssangulartypescriptng-class

Answer 1

你可以这样做：

<input [ngClass]="{ 'class1': charlen < 128, 'class2': charlen >= 128 }" />