Control header label position in Angular 8

Question

I am creating datatable in Angular 8. I am trying to display 'Column A' heading aligned left and 'Column B' heading aligned right. Trying out many solutions and nothing is working. The CSS class applied to header label is 'datatable-header-cell' Please help me to align these labels correctly. I drew small sample in Paint to show what I am trying to do. Thanks in advance.

<ngx-datatable #myTable class="material skf-table" [rows]="rows" [columns]="columns" [columnMode]="'force'"
  [scrollbarH]="true" [headerHeight]="'50'" [loadingIndicator]="isLoading" [footerHeight]="'50'" [rowHeight]="'50'">
  <ngx-datatable-column *ngFor="let column of columns; let i = index" name="{{ column.name }}"
    prop="{{ column.prop }}" frozenLeft="{{ column.frozenLeft }}">
    <ng-template let-value="value" let-row="row" let-name="name" ngx-datatable-cell-template>
      <ng-container ngSwitch="{{ column.prop }}">
        <ng-container *ngSwitchCase="'Column A'">
          <span [style.color]="value > 0?'green':'red'" [style.text-align]="right"
            style="float: right;">{{ numberWithCommas(value.toFixed(0)) }}</span>
        </ng-container>
        <ng-container *ngSwitchCase="'Column B'">
          <span [style.color]="value > 0?'green':'red'" [style.text-align]="right"
            style="float: right;">{{ numberWithCommas(value.toFixed(0)) }}</span>
        </ng-container>

    </ng-template>
  </ngx-datatable-column>
</ngx-datatable>

Answer 1

After some research I added following code to css file and that fixed the issue for me.

::ng-deep .datatable-header-cell:nth-child(1)      {
  text-align: left !important;
}


::ng-deep .datatable-header-cell      {
  text-align: right !important;
}