在具有相同元素的1个以上实例的同时，如何从元素中添加或删除类名

Question

我在从元素添加或删除CSS类名时遇到困难。看来它没有添加类，其覆盖其他类可能是。

<div class="my-div class-a"></div>

我希望在代码中将class-b添加到此div。

thisDivElement.className = 'class-b';

这将删除my-div class-a，而粘贴class-b。

<div class="class-b"></div>

因此，如何在Angular2中添加/删除类，而不会过分其他类。请建议这样做正确的方法。

Answer 1

取自角文档：

<some-element [ngClass]="{'first': true, 'second': true, 'third': false}">...</some-element>

您可以通过在代码中设置的变量替换true/false值来修改哪些类活动。

例如。html：

<some-element [ngClass]="{'first': firstClassActive, 'second': secondClassActive, 'third': thirdClassActive}">...</some-element>

打字稿：

export class AppComponent {
  firstClassActive: boolean = true;
  secondClassActive: boolean = false;
  thirdClassActive: boolean = false;
}

在此处进行更详细的示例：https：//angular.io/docs/ts/latest/api/common/index/ngclass-diractive.html

我还应该指出，您可以使用jQuery来执行此操作，这将使您可以直接访问DOM元素 - 但是您认为在我看来，您会更好地坚持使用Angular模板绑定。<<<<<<<<<<<</p>