Angular 当同一元素有多个实例时，如何在元素中添加或删除类名以及其他类

我在元素中添加或删除CSS类名时遇到问题。 它似乎没有添加类，它可能会覆盖任何其他类

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

这将删除

my div class-a

，而是粘贴

class-b

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

---

那么如何在angular2中添加/删除类而不覆盖其他类。请为正确的方法提供建议。

摘自以下文档：

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

这里有更详细的例子：

---

我还应该指出，您可以使用jQuery实现这一点，这将使您能够更直接地访问DOM元素——但在我看来，您最好还是坚持使用角度模板绑定。

重要！请记住，元素有多个实例。我想从特定元素中添加/删除类很抱歉，我没有提到一些重要的内容。如果我的div在我的模板中有多个实例，并且我只想根据您所说的div的数量更改特定的实例，如果不是太多，那么我建议您为每个div创建变量，以便您可以单独控制它们。如果要控制很多div，那么可能需要为每个div创建一个子组件，并使用一个输入参数，以便可以从父组件设置它们的值。

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

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

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