Pager doesnot show when custom filter is used.

When I use **custom filter** the **pager** doesnot render. But after I search someting in any other **default filter** except the **custom** ones, the pager appears. But when I reload the page it disappears.
I know It is because of the **custom filter** that I am using. When I remove the custom filter option this issue never happens.

**This the settings where I render my custom filter**
`
settings = {

hideHeader: true,
hideSubHeader: false,
add: {
addButtonContent: '',
createButtonContent: '',
cancelButtonContent: '',
confirmCreate: true,
},
edit: {
editButtonContent: '',
saveButtonContent: '',
cancelButtonContent: '',
},
delete: {
deleteButtonContent: '',
confirmDelete: true,
},
actions: {
add: false,
edit: false,
delete: false,
},
columns: {
name: {
title: 'Project Name',
type: 'string',
},
description: {
title: 'Description',
type: 'string',
width: "20%"
},
type: {
title: 'Project Type',
type: 'string',
},
scheme: {
title: 'Scheme',
type: 'string',
},
assigned_to: {
title: 'Engineer',
type: 'string',
},
assigned_contractor: {
title: 'Contractor',
type: 'string',
},
physical_progress: {
title: 'Physical Progress',
filter: {
type: 'custom',
component: RangeFilterProgressComponent
},
width: "10%"
},
},
};
`

**This the custom filter component**
``
import {Component, OnChanges, OnInit} from '@angular/core';
import { FormControl } from '@angular/forms';
import { NbDialogService } from '@nebular/theme';
import { DefaultFilter } from 'ng2-smart-table';
import { ShowcaseDialogComponent } from '../showcase-dialog/showcase-dialog.component';

@Component({
template: `
Select
`,
})
export class RangeFilterProgressComponent extends DefaultFilter implements OnInit {
inputControl = new FormControl();

constructor(private dialogService: NbDialogService) {
super();
}

ngOnInit() {
}
onClick=(event)=>{
console.log(event);
this.dialogService.open(ShowcaseDialogComponent, {
context: {
title: 'Select Range',
button: 'progress'
},
});
}
}

`