o se puede reordenar columnas en la tabla angular ngx-data

Estoy trabajando en angulares ngx-datatables, donde necesito lograr su funcionalidad de reordenamiento de columnas. Pero no funciona (no se produce ningún error), también el ancho de la columna no cambia al arrastrar la línea.

He agregado a continuación los archivos css en el archivo angular.json. ¿Requiere algún archivo js?

"node_modules/@swimlane/ngx-datatable/release/components/datatable.component.css",

"node_modules/@swimlane/ngx-datatable/release/themes/material.css",

"node_modules/@swimlane/ngx-datatable/release/themes/dark.css",

"node_modules/@swimlane/ngx-datatable/release/assets/icons.css"

Estoy siguiendoest enlace.

     @Component({
          selector: 'app-my-component',
          styles: [`
            .icon {
              position:absolute;
            }
            .datatable-icon-down {
              top: 0px;
            }
            .datatable-icon-up {
              top: 40px;
            }
            .dragFromLeft .icon {
              left:-13px;
            }
          `],
          template: `
        <div>
            <ngx-datatable 
              class="material"
              [rows]="rows"      
              [columnMode]="'force'"
              [headerHeight]="50"
              [footerHeight]="50"
              [rowHeight]="'auto'"
              [externalPaging]="true"
              [externalSorting]="true"
              [count]="page.count"
              [offset]="page.offset"
              [limit]="page.limit"
              [sortType]="'single'"
              (page)="pageCallback($event)"
              (sort)="sortCallback($event)"
              [reorderable]="reorderable"
              [swapColumns]="swapColumns"
              [targetMarkerTemplate]="targetMarkerTemplate"
              [loadingIndicator]="loadingIndicator" >
        <ngx-datatable-column 
                    *ngFor="let col of columns" 
                    [name]="col.name" [prop]="col.prop">
                  </ngx-datatable-column>

            </ngx-datatable>
             <ng-template #targetMarkerTemplate let-class="class">
                <div [ngClass]="class">
                  <div class="icon datatable-icon-down"></div>
                  <div class="icon datatable-icon-up"></div>
                </div>
              </ng-template>
             <div class='selected-column'>
                <h4>Available Columns</h4>
                <ul>
                  <li *ngFor='let col of allcolumns'>
                    <input
                      type='checkbox'
                      [id]="col.name"
                      (click)='toggle(col)'
                      [checked]='isChecked(col)'
                    />
                    <label [attr.for]="col.name">{{col.name}}</label>
                  </li>
                </ul>
              </div>
            </div>
          `
        })
        export class NGXServerSide implements OnInit {
          rows: Object[] = [];
          loadingIndicator: boolean = false;
          reorderable: boolean = true;
          swapColumns: boolean = false;
          columns = [
        { name: 'EmployeeId', prop: 'EmployeeId' },
        { name: 'Name', prop: 'Name' },
        { name: 'City', prop: 'City' },
        { name: 'Department', prop: 'Department', sortable: false  },
        { name: 'Gender', prop: 'Gender', sortable: false },
      ];      
 allcolumns = [
    { name: 'EmployeeId', prop: 'EmployeeId' },
    { name: 'Name', prop: 'Name' },
    { name: 'City', prop: 'City' },
    { name: 'Department', prop: 'Department', sortable: false },
    { name: 'Gender', prop: 'Gender', sortable: false },
  ]

Respuestas a la pregunta(0)

Su respuesta a la pregunta