angular-smd icon indicating copy to clipboard operation
angular-smd copied to clipboard

Setting custom page count

Open hemantvikram opened this issue 7 years ago • 0 comments

Hi Team,

I 'm trying to set the page count but it is not working. Can you please review my code below and help me solve this problem?

HTML code ` <smd-datatable #personDataTable [models]="models" [paginated]="true" [paginatorRanges]="[10, 25, 50, 100]" [responsive]="true">

    <smd-datatable-header [enableFilter]="true" filterLabel="Filter">

        <smd-datatable-action-button (onClick)="addSample($event)" label="Add"></smd-datatable-action-button>
        
        <smd-datatable-contextual-button (onClick)="editSample($event)" icon="edit" [minimunSelected]="1" [maxSelected]="1"></smd-datatable-contextual-button>

        <smd-datatable-contextual-button (onClick)="removeSample($event)" icon="delete" [minimunSelected]="1"></smd-datatable-contextual-button>

    </smd-datatable-header>

    <smd-datatable-column title="Id" field="id" sortable="true" numeric="true" titleTooltip="The identifier Tooltip"></smd-datatable-column>

    <smd-datatable-column title="Name" field="name" sortable="true" titleTooltip="Person name"></smd-datatable-column>

    <smd-datatable-column title="Salary" numeric="true" field="salary" sortable="true"></smd-datatable-column>

    <smd-datatable-column title="DOB" field="dob" sortable="true" [sortFn]="_sortByBirthDate" [filterFn]="_filterByBirthDate">
        <ng-template let-model="data">
            {{model.dob | date:'dd/MM/yyyy'}}
        </ng-template>
    </smd-datatable-column>

    <smd-datatable-column title="Gender" field="gender" titleTooltip="Gender">
        <template let-model="data">
            <md-icon>{{model.gender}}</md-icon>
        </template>
    </smd-datatable-column>
</smd-datatable>

`

TypeScript code ` import { SmdDataTable } from '../shared/component/smd-datatable/datatable.component' import { SmdPaginatorComponent, SmdPaginationModel } from '../shared/component/smd-paginator/paginator.component' import { Result, PagedCollectionResult } from '../shared/base-result-type'

@Component({ selector: 'person-list', templateUrl: './person.component.html', styleUrls: ['./person.component.css'] })

export class PersonListComponent { @ViewChild("personDataTable") personDataTable: SmdDataTable; models: Person[]; responsive: boolean = true;

ngOnInit() {
    this.personDataTable.paginatorComponent.currentPage.page = 1;
    this.personDataTable.paginatorComponent.selectedRange = 10;

    this.refreshList();
}

refreshList() {
    var searchFilter = new SearchFilter();
    searchFilter.pageNumber = this.personDataTable.paginatorComponent.currentPage.page;
    searchFilter.pageSize = this.personDataTable.paginatorComponent.selectedRange;

    this.personService.getAll(searchFilter)
        .then(result => {
            if (result.isSuccessful) {
                this.models = result.data;
                **this.personDataTable.paginatorComponent.count = result.totalRecords;**
            }
        });
}

constructor(private personService: PersonService) {
}

} `

The bold area is where I'm trying to set the pagecount but it is not working.

Thanks, Hemant.

hemantvikram avatar Aug 18 '17 13:08 hemantvikram