jqwidgets-framework/demos/Angular/src/datatable/columnformatting/app.component.html

jQWidgets is an advanced Angular, Vue, Blazor, React, Web Components, jquery, ASP .NET MVC, Custom Elements and HTML5 UI framework.

<jqxDataTable #myDataTable
    [width]="getWidth()" [source]="dataAdapter" [columns]="columns"
    [sortable]="true" [pageable]="true" [columnsResize]="true">
</jqxDataTable>

<div style="font-size: 13px; font-family: Verdana; width: 600px; margin-top: 10px">
  <div style="float: left; width: 300px">
    <h4>Shipped Date</h4>

    <jqxDropDownList (onChange)="dateFormats($event)"
        [height]="25" [autoDropDownHeight]="true"
        [selectedIndex]="1" [source]="dateSource">
    </jqxDropDownList>

  </div>
  <div style="float: left; width: 300px">
    <h4>Freight</h4>

    <jqxDropDownList (onChange)="numberFormats($event)"
        [height]="25" [autoDropDownHeight]="true"
        [selectedIndex]="1" [source]="numberSource">
    </jqxDropDownList>

  </div>
</div>