How to change a CSS class using Angular 7

Question

I am using ngx-bootstrap's modals and I want to change the CSS class modal-dialog with some other properties.

My question is: How do I dynamically change the properties of for example this class in Angular?

I have played around with ElementRef, TemplateRef and Rendere2 but not found any solution.

Thanks for you help in advance.

EDIT 1:

I am opening the modal using BsModalService, so my template looks like this:

<ng-template #defaultModalTemplate>
    Content
</ng-template>

I open the dialog like this:

public openModal(): void {
    this.modalRef = this.modalService.show(this.templateRef);

    if (this.renderer && this.templateRef) { // trying to extract .modal-dialog here

    }
}

the variable templateRef is defined like this:

@ViewChild('defaultModalTemplate') public templateRef?: TemplateRef<any>;

Answer 1

你可以通过class binding或NgClass

<div [class.className]="proerty(boolean)">some text or elements</div>

此处的属性是否true将激活/添加类false停用/删除

或者

<div [ngClass]="{'className': expiration }">some text or elements</div>

使用这种方法，您可以使用 more thanclass并通过到期控制它们，您需要,像这样将它们分开{'className': expiration, 'anotherClass': expiration }