Hello,
According to https://es.infragistics.com/products/ignite-ui-angular/docs/typescript/classes/igxcolumngroupcomponent.html cellClasses is a supported property for the igx-column-group control.
When I attempt to apply a css class using this property though it is ignore. Here is a sample of my implementation:
<igx-column-group [header]="'Contact Name'" [cellClasses]="igx-thead_center-and-middle-text">
Am I missing something?
Thanks!
Hello,IgxColumnGroupComponent as you have already know define a logical group of columns, so through it you can define only properties that determine the column behavior as a pinning, hiding and so on and you can not use it to set a properties that needs to applied to a cell. So for now the best I can suggest you is to set this class for each column in you group to define the specific class that you need like the following:
<igx-column-group [movable]="true" header="Address Information"> <igx-column [movable]="true" filterable="true" sortable="true" resizable="true" field="Country" [cellClasses]="{'igx-thead_center-and-middle-text':true}"></igx-column> <igx-column [movable]="true" filterable="true" sortable="true" resizable="true" field="City" [cellClasses]="{'igx-thead_center-and-middle-text':true}"></igx-column> <igx-column [movable]="true" filterable="true" sortable="true" resizable="true" field="Address" [cellClasses]="{'igx-thead_center-and-middle-text':true}"></igx-column></igx-column-group>
If you need any additional assistance, please contact us.
The cellClassses property works a lot like the ngClass directive. It expects an object where the keys are the style classes that are to be applied and the values are either simple Boolean values or a callback that returns a Boolean value.
You can check out this sample where you can see it in action.
In your case it will be [cellClasses]="{'center-and-middle-text': true}"