Angular, How to add class to tag has already some css classes before form the html template directly?

Question

I want to write code like this note: the classes in the class (style13 style121 style541) property i don't have any control on it and i want to add other class from variable on the TS

example:

<div class="style13 style121 style541" [class]="varInTheCode" [class.other-style3]="true">
...
<div>

TS

export class MyDataTableComponent implements OnInit, OnChanges {
    varInTheCode:string = "other-style1 other-style2";

}

I hope the result in the browser will be like this:

<div class="style13 style121 style541 other-style1 other-style2 other-style3" ...>
...
<div>

but the problem always [class] replace the class!

can i do it?

Answer 1

You have two options here:

• Use Ivy(Angular 9^): it should work out of the box there

• Use [ngClass] directive instead of [class] property binding