import { ChangeDetectionStrategy , Component , EventEmitter , Input , OnDestroy , OnInit , Output } from '@angular/core' ; import { ReplaySubject } from 'rxjs' ; import { FormControl , FormGroup } from '@angular/forms' ; import { takeUntil } from 'rxjs/operators' ; /**
 * Interface for a page length selection.
 */ export interface PageLengthEntry { label : string | number ; value : number ; } @ Component ( { selector : 'table-page-size' , templateUrl : './table-page-size.component.html' , styleUrls : [ './table-page-size.component.scss' ] , changeDetection : ChangeDetectionStrategy . Default , } ) export class TablePageSizeComponent implements OnInit , OnDestroy { private private subscriber : ReplaySubject < void > = new ReplaySubject < void > ( ) ; /**
     * Page size select form group.
     */ public form : FormGroup ; private private readonly defaultPageSize : number = 10 ; private private readonly defaultPageSizeList : Array < PageLengthEntry > = [ { label : '10' , value : 10 } , { label : '25' , value : 25 } , { label : '50' , value : 50 } , { label : '100' , value : 100 } , { label : '200' , value : 200 } , { label : '500' , value : 500 } ] ; /**
     * The current page size.
     */ public pageSize : number = this . defaultPageSize ; /**
     * The current page size list.
     */ public pageSizeList : Array < PageLengthEntry > = this . defaultPageSizeList ; param size @ Input ( 'pageSize' ) public set PageSize ( size ) { this . pageSize = size || this . defaultPageSize ; this . form . get ( 'size' ) . setValue ( this . pageSize ) ; } param list @ Input ( 'pageSizeList' ) public set PageSizeList ( list ) { this . pageSizeList = list || this . defaultPageSizeList ; } /**
     * Page size change event emitter.
     */ @ Output ( ) public pageSizeChange : EventEmitter < number > = new EventEmitter < number > ( ) ; /**
     * Constructor of `TablePageSizeComponent`.
     */ constructor ( ) { this . form = new FormGroup ( { size : new FormControl ( this . pageSize ) , } ) ; } /**
     * OnInit of `TablePageSizeComponent`.
     * Auto subscribes to size control values changes.
     * Emits changes to pageSizeChange EventEmitter.
     */ public ngOnInit ( ) { this . size . valueChanges . pipe ( takeUntil ( this . subscriber ) ) . subscribe ( ( size ) => this . pageSizeChange . emit ( size ) ) ; } /**
     * Get the form control of the size selection.
     */ public get size ( ) : FormControl { return this . form . get ( 'size' ) as FormControl ; } /**
     * OnDestroy of `TablePageSizeComponent`.
     * Sends complete call to the component subscriber.
     */ public ngOnDestroy ( ) { this . subscriber . next ( ) ; this . subscriber . complete ( ) ; } }