ListView is not showing/binding data

[Towhidul]

I have ListView like following:

    <div ng-controller="patientSearchCtrl">
        <div kendo-list-view id="listView" k-data-source="source">
            <div class="product" k-template>
                <h3>{{ dataItem.First_Name }}</h3>
                <p>{{ dataItem.Last_Name }}</p> 
            </div>
        </div>
        <div kendo-pager k-data-source="source"></div>
    </div>


And following AngularJS code:

    angular.module("alertApp", ["kendo.directives"])
            .controller("patientSearchCtrl", function ($scope, $http) {
                var product;
                $http.get('http://localhost:1242/Api/PatientSearch?firstName=Bar&lastName=wells&pageIndex=0&pageSize=10&sortingOrder=FIRST_NAME').
                  success(function (info, status, headers, config) {                     
                      product = info[0]["Table"];
                      console.log(product); 
                  }).
                  error(function (data, status, headers, config) {
                      console.log('Error: ' + data);
                  });
                $scope.source = new kendo.data.DataSource({
                    data: product,
                    pageSize: 1
                });
            });                                                                                                  
   

  console.log(product); is logging data. In Chrome it looks like:
    [Object]
          0: Object
                  DOB: "07-29-1969"
                  First_Name: "Barbara"
                  Last_Name: "Wells"
                  PatientKey: 3
                  RowIndex: 1
                  
I'm using telerik.kendoui.professional.2014.3.1411.trial version.

[Petyo]

Hello,

please check this example for the correct means to integrate $http service with a datasource instance.

Regards,
Petyo
Telerik

 

 

[Towhidul]

This is an example of gridview. My problem is with ListView. I've changed my code like following and it still not working.
In example they used

    $scope.gridOptions = {
    ....
    }

What will I use in place of 'gridOptions'?

[Petyo]

Hello Towhidul,

the datasource configuration of the two widgets is the same, since they both use the DataSource component for data binding. 

The variable name does not matter, as long as it matches the attribute value in the directive. 

Regards,
Petyo
Telerik