web-dev-qa-db-fra.com

pied de page datable ngx personnaliser

Comment personnaliser la table de données ngx. Je ne suis pas en mesure de trouver où je dois changer le code pour se débarrasser de ce nombre total d'enregistrements et le remplacer par une liste déroulante pour afficher les éléments par page. Ma pagination manque également quelques icônes.

enter image description here

11
WebDev

Utilisez le modèle de pied de page personnalisé (reportez-vous au lien ci-dessous). il remplace donc le pied de page par défaut.

https://github.com/swimlane/ngx-datatable/blob/master/demo/basic/footer.component.ts

Exemples

Si vous voulez simplement vous débarrasser du pied de page, utilisez simplement:

<ngx-datatable-footer></ngx-datatable-footer>

Si vous souhaitez le personnaliser:

<ngx-datatable-footer>
  <ng-template
    ngx-datatable-footer-template
    let-rowCount="rowCount"
    let-pageSize="pageSize"
    let-selectedCount="selectedCount"
    let-curPage="curPage"
    let-offset="offset"
  >
    <div style="padding: 5px 10px">
      <div><strong>Summary</strong>: Gender: Female</div>
      <hr style="width:100%" />
      <div>
        Rows: {{ rowCount }} | Size: {{ pageSize }} | Current:
        {{ curPage }} | Offset: {{ offset }}
      </div>
    </div>
  </ng-template>
</ngx-datatable-footer>
11
Gayantha

Mais si vous souhaitez modifier uniquement "total" ou "aucun élément trouvé", remplacez la propriété des messages:

//Static messages in the table you can override for localization.
{
  // Message to show when array is presented
  // but contains no values
  emptyMessage: 'No data to display',
  // Footer total message
  totalMessage: 'total'
}

https://swimlane.gitbooks.io/ngx-datatable/api/table/inputs.html

1