如何使用角度中的 ng 类添加具有不同条件的多个类名？

Question

我需要在特定条件下向元素添加 2 个类名：

ng-class="(commentItem.comment | escapeHtml | direction)"

适用于第一个，使用“escapeHtml”过滤器获取给定 html 字符串的文本内容，然后使用“direction”过滤器获取文本的方向。现在我需要通过这种方式向同一个元素添加另一个类：

ng-class="{'hidden': commentItem.isEditing}"

如何将它们混合在一个 ngClass 指令中？

注意
我认为不可能使用

{"exp1": condition1, "exp2": condition2}

因为在第一个条件下，过滤器为我返回类名。

Answer 1

看看这个plnkr。

ng-class关于该参数的文档指出：

要评估的表达式。评估的结果可以是表示以空格分隔的类名的字符串、数组或类名到布尔值的映射。

它不一定是文字字符串、映射或数组。您可以让函数返回一个类数组，如下所示：

ng-class="getClasses()"

并使用您喜欢的任何内容在控制器中构造数组。如果您需要过滤器，请使用该$filter服务。

如果您不想使用控制器函数来处理视图详细信息，您可以传递一个数组，ng-class并为每个元素编写一个返回类名或空字符串的表达式：

ng-class="[!!redbg ? 'redbg' : '', 'gr' + 'een']"