Wie die letzte Seite Schaltfläche in PrineNG Datentabelle deaktivieren?

Question

Ich möchte letzte Seite Schaltfläche in der primeNG Datentabelle div deaktivieren. Der Paginator befindet sich im Tag p-datatable.

Code:

<div class="ui-g-12"> 
     <p-dataTable [value]="bossDataTable" resizableColumns="true" columnResizeMode="expand" [lazy]="true" [rows]="15" [paginator]="true" 
     [totalRecords]="totalRecords" [rowsPerPageOptions]="[15,20,25,30,40,50]" (onLazyLoad)="getBossDataTable($event)" > 

     <!--some columns here --> 
      <p-footer><span><label i18n>Total:</label> {{totalRecords}}</span></p-footer> 
     </p-dataTable> 

zu doc ​​nach: https://www.primefaces.org/primeng/#/paginator

ich letzte Seite Stil hier bekam: ui-paginator-last

Wie kann ich die letzte Seite-Taste deaktivieren ausblenden es oder deaktivieren ist in Ordnung.

Nun ist die paginator wie folgt aussieht: |< < 1 2 3 4 5 > >|

Answer 1

CSS können Sie die letzte Seite-Taste so verstecken:

.ui-paginator > .ui-paginator-last { 
    display: none!important; 
} 

Da .ui-paginator-last ist ein Anker-Tag Sie es ist deaktiviert simulieren können, indem Sie dies:

.ui-paginator > .ui-paginator-last { 
    pointer-events: none; 
    color: gray; 
} 

Wenn Sie die Paginierung, einzigartig sein möchten, können Sie es in die Fußzeile des DATAT hinzufügen Lage und geben ihm ein einzigartiges styleClass:

<p-dataTable [value]="cars" (change)="onDataTableChange($event)" 
    styleClass="hidden-last" 
    resizableColumns="true" [reorderableColumns]="true"> 
    <p-column *ngFor="let col of cols" [field]="col.field" 
    [header]="col.header"></p-column> 
    <p-footer><p-paginator styleClass="paginator1"></p-paginator></p-footer> 
</p-dataTable> 

Dann werden Sie die gleiche Sache zu tun haben, aber den Klassennamen verwenden, sind Sie auf die paginator:

.paginator1 > .ui-paginator-last { 
    pointer-events: none; 
    color: gray; 
} 

oder:

.paginator1 > .ui-paginator-last { 
    display: none!important; 
} 

Hier ist ein PLNKR, der diesen Ansatz demonstriert (zwei Tabellen, eine letzte Schaltfläche deaktiviert): Click here