Grid- Lazy Loading - pagination count from server is not reflecting

[propelsoftware]

I'm submitting a...

[ ] Regression (a behavior that used to work and stopped working in a new release)
[X] Bug report  
[ ] Feature request
[ ] Documentation issue or request
[ ] Support request

Current behavior

We were trying the data grid lazy loading feature, if you notice in the code below am setting the value for totalDataCount variable based on the count sent from the server inside the subscribe. But it is not reflected in the template, it always shows only one page as I had instantiated the variable to 10. In the console I can see the value for the variable got changed based on the server response. I tried change detectors, still not luck. if assign a value to the variable outside the subscribe, it gets it.

This is a show stopper for our development. Can you please help.

Expected behavior

totaldatacount should be updated based on the count sent from server inside the subscribe function. So that the total pages in pagination below the grid is correct.

Minimal reproduction of the problem with instructions

For bug reports please provide the STEPS TO REPRODUCE and if possible a MINIMAL DEMO of the problem via
https://plnkr.co or similar (you can use Our Amexio Plunker as a starting point: http://plnkr.co/edit/M9AeGH?p=info)
<amexio-datagrid
[enable-column-fiter]="false"
[enable-checkbox]="false"
[data]="entities"
[enable-data-filter]="false"
[server-side-paging]="true"
[total-data-count]="totalDataCount"
(onPageChange)="loadPageData($event)"
amexioColorPalette [color-palette]="'vibrant: amexio-theme-color1'" [gradient]="false"
>

In the ts file constructor has the below call to server, i instantiated totalDataCount to 10 before the service call.

totalDataCount = 10;
this._Service.getInventoryItemEntities().subscribe(
data => {
console.log(data);
if (data['message'] == this._dispLabel.getLabel('responseSuccess')) {
console.log(data.data.data.length);
if (data.data.data.length > 0) {
this.totalDataCount = data.data.total;
this.entities = data.data.data;
console.log(this.entities);
}
}
//this.ref.markForCheck();
//this.ref.detectChanges();
},
error => {

    throw error;
  }
);

What is the motivation / use case for changing the behavior?

we have huge data set and pagination is the way to load the ui faster.

Environment

Angular version: 8


Browser:
- [ X] Chrome (desktop) version XX
- [ X] Chrome (Android) version XX
- [X ] Chrome (iOS) version XX
- [ ] Firefox version XX
- [ ] Safari (desktop) version XX
- [ ] Safari (iOS) version XX
- [ ] IE version XX
- [ ] Edge version XX
 
For Tooling issues:
- Node version: XX  
- Platform:  

Others: