PrimeNg p-tabpanel bind headerStyleClass

Viewed 755

I am using the tabview component from prime NG and for some reason I cannot bind a header style class.

HTML (this works but is static)

<p-tabPanel header="Title" headerStyleClass="badge" formGroupName="groupName">

I like to use headerStyleClass with a condition: (this does not work)

<p-tabPanel header="Title" [headerStyleClass]="{'badge': formGroup.get('groupName').dirty}" formGroupName="groupName">

How can I bind the class property?

1 Answers

In headerStyleClass takes string so try passing like this

[headerStyleClass]="formGroup.get('groupName').dirty ? 'badge': ''"
Related