web-dev-qa-db-fra.com

Le tri ngx-DataTable sur une colonne ne fonctionne pas Angular 4

Bien que je sois très nouveau dans le domaine angulaire, je rencontre des difficultés à utiliser ngx-DataTable. J'utilise simple ngx-DataTable pour des opérations simples. Le problème est sur une colonne, le tri ne fonctionne pas bien que j'ai déclaré attr comme [sortable] = true. Voici le code. Définition du tableau:

 <ngx-datatable
                [columns]="columns"
                [columnMode]="'force'"
                [headerHeight]="40"
                [footerHeight]="50"
                [rowHeight]="'auto'"
                [limit]="10"
                [rows]='contacts'>

DataTable Contient deux colonnes et les définitions sont les suivantes.

    <ngx-datatable-column
                        [width]="50"
                        [resizeable]="true"
                        [sortable]="true"
                        [draggable]="true"
                        [canAutoResize]="true" name="Name">
       <ng-template let-row="row" ngx-datatable-cell-template>
          <span>{{row.first_name}}</span>
       </ng-template>
   </ngx-datatable-column>

    <ngx-datatable-column
                        [width]="50"
                        [resizeable]="true"
                        [sortable]="true"
                        [draggable]="true"
                        [canAutoResize]="true" name="Actions">
        <ng-template let-row="row" let-rowIndex="rowIndex" ngx-datatable-cell-template>
      <!--Template Here-->
        </ng-template>
   </ngx-datatable-column>

Je veux juste rendre ma colonne de nom triable. S'il vous plaît, aidez-moi les gars. Merci d'avance.

javascriptangularngx-datatable
10
Yash Majithiya

Eh bien, il a résolu. En fait, il ne trouve pas les valeurs où il peut trier les colonnes. donc je viens d'écrire prop='first_name' dans ngx-datatable-column déclaration pour lui faire savoir ce qui doit être trié, comme ceci.

<ngx-datatable-column
    [width]="50"
    [resizeable]="true"
    [sortable]="true"
    [draggable]="true"
    [canAutoResize]="true" name="Name" prop="first_name">
</ngx-datatable-column>
23
Yash Majithiya