有条件地在聚合物中添加css类

Question

我在聚合物组件中有一个元素，并希望有条件地添加一个css类。

<div class="bottom {{completed: item.completed}}">

如果item.isCompleted为true，则添加.completed类。

但是，我有以下错误：

表达式语法无效：已完成？：item.completed

我不想将孔子树放在模板条件中。是否可以在html标签内使用表达式？我正在使用最后一个聚合物版本，这种功能是否以任何方式迁移或替换？

Answer 1

最简单的方法：

<template>
  <style is="custom-style">
      .item-completed-true { background: red; }
  </style>
  <div class$="bottom item-completed-[[item.completed]]"></div>
</template>