Angular 在Typescript函数返回true后添加CSS类

在函数返回真值后，我想将某个css类添加到我的Div中：

---

双击函数返回true。

使用

ngClass

。另外，使用括号，因为双击是一个函数

<div [ngClass]="{'cell-select': doubleClick(),'cell-deselect': !doubleClick() }">Content</div>

内容

或者简单地说，你可以不用ngClass就可以做到这一点

<div class="{{doubleClick() ? 'cell-select' : 'cell-deselect'}}"></div>

---

您可以通过其他方式获得相同的结果，并避免这些情况

{func（）}

或

[prop]=“func（）”

在发生任何ui更改时（如单击另一个按钮或在文本框中编写内容）评估此函数，而这与它本身的方法无关

我们可以调用函数来更新属性并将该属性绑定到ngClass指令

模板

您可以切换一个值

模板

---

stackblitz演示感谢您的回答，但它似乎不起作用，我得到：

模板解析错误：解析器错误：预期缺失：在第17列

每次运行angular digest cycle时，都会运行。简直太多了

<div [ngClass]="{'cell-select':clicked ,'cell-deselect': !clicked }" 
     (dblclick)="doubleClick()">
  Content
 </div>

  clicked = false;
  doubleClick() {
    this.clicked = true;
  }

<div [ngClass]="{'cell-select':toggled ,'cell-deselect': !toggled }" 
     (dblclick)="toggleDoubleClick()">
  toggle
 </div>

toggled= false;
  toggleDoubleClick(){
    this.toggled = !this.toggled;
  }