Error: Cannot read property 'count' of undefined. Databinding Web API Angular 2

[Luis Lora]

Hi.

I get this error when I try to get data from Web API using Angular 2

This is the full error message:

ERROR TypeError: Cannot read property 'count' of undefined
    at Ajax.fnSuccess [as onSuccess] (manager.js:240)
    at Ajax.webpackJsonp.../../../../@syncfusion/ej2-base/dist/es6/ajax.js.Ajax.successHandler (ajax.js:68)
    at Ajax.webpackJsonp.../../../../@syncfusion/ej2-base/dist/es6/ajax.js.Ajax.stateChange (ajax.js:95)
    at XMLHttpRequest._this.httpRequest.onreadystatechange [as __zone_symbol__ON_PROPERTYreadystatechange] (ajax.js:53)
    at XMLHttpRequest.wrapFn (zone.js:1166)
    at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:425)
    at Object.onInvokeTask (core.es5.js:3881)
    at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:424)
    at Zone.webpackJsonp.../../../../zone.js/dist/zone.js.Zone.runTask (zone.js:192)
    at ZoneTask.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneTask.invokeTask [as invoke] (zone.js:499)

This is my .html component code

<ej-grid #gridVacunas [dataSource]='data' [enableHover]="false" [allowSelection]="true" [selectionSettings]="selectOptions">

<e-columns>

<e-column type='checkbox' width='50'>e-column>

<e-column field='codigo' headerText='Código' width='120'>e-column>

<e-column field='nombre' headerText='Nombre' width='250'>e-column>

e-columns>

ej-grid>

This is my .ts component code

import { DataManager, WebApiAdaptor } from '@syncfusion/ej2-data';

[...]

export class FormComponent implements OnInit {

public data: DataManager;

[...]

ngOnInit() {

this.selectOptions = { persistSelection: true };

this.data = new DataManager({

url: '/api/vacunas',

adaptor: new WebApiAdaptor

});

}

And this is the API's response

1. {items: [,…], count: 18}
1. count:18
2. items:[,…]
1. 0:{id: 1, codigo: "bf", nombre: "Vacuna leishmania", cadencia: 345, cadenciaReal: 365, edadMinima: 6,…}
2. 1:{id: 2, codigo: "COR", nombre: "Vacuna coronavirus", cadencia: 345, cadenciaReal: 345, edadMinima: 2,…}
3. 2:{id: 3, codigo: "duramu", nombre: "vacuna duramune 8", cadencia: 0, cadenciaReal: 0, edadMinima: 0,…}
3. [...]
   

Thank you.

[Pavithra Subramaniyam]

Hi Luis, 

We have validated your query and  we are not able to reproduce the reported issue. We have prepared a simple sample based on your code example. Please refer the following sample link. 

Sample Link: http://www.syncfusion.com/downloads/support/directtrac/general/ze/NGMVC-61283497  

Could you please replicate your issue in the above sample and get back to us with more information regarding the issue so that we can analyse based on that and provide you better solution? The information provided would be a great help for us to resolve this issue. 

Regards, 

Pavithra S. 

[Luis Lora]

OK, I'll try to replicate and send you.

Thank you!

[Pavithra Subramaniyam]

Hi Luis, 

 

Thanks for the update. 

 

Please let me know if you have any queries. 

 

Regards, 

Pavithra S.