Question

<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>

<script src="../../Scripts/vendor/jquery-2.0.3.min.js"></script>
<script src="../../Scripts/vendor/angular.js"></script>
<script src="../../Scripts/vendor/kendo.core.min.js"></script>
<script src="../../Scripts/vendor/kendo.angular.min.js"></script>
<script src="../../Scripts/vendor/kendo.all.min.js"></script>
<script src="alertApp.js"></script>

<script>
    angular.module("alertApp", ["kendo.directives"])
        .controller("patientSearchCtrl", function ($scope, $http) {
            var product= null;//= [{ RowIndex: 1, PatientKey: 3, First_Name: "Barbara", Last_Name: "Wells", DOB: "07-29-1969" }];

            $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);
                  $scope.source = new kendo.data.DataSource({
                      data: info[0]["Table"],
                      pageSize: 21
                  });
              }).
              error(function (data, status, headers, config) {
                  console.log('Error: ' + data);
              });                
        });
</script>

在上面的代码中console.log(product)给出了输出：

[Object]
    0: Object
    First_Name: "Barbara"
    Last_name: "Wells"
    DOB: '07-29-1969'

但ListView不显示任何数据。我在这里缺少什么？如果我硬编码数据，就像它的工作正常。

$scope.source = new kendo.data.DataSource({
   data: [{ RowIndex: 1, PatientKey: 3, First_Name: "Barbara", Last_Name: "Wells", DOB: "07-29-1969" }],
   pageSize: 21
 });

Answer 1

尝试更改

$scope.source = new kendo.data.DataSource({
                data: product,
                pageSize: 1
            });

到

$scope.source = {
                data: product,
                pageSize: 1
            };

或

$scope.source = product;

提供完整的选择。使用以下代码

  <div kendo-list-view k-options="source "></div>

            $scope.source = {
                      dataSource: products,
                      template: "<div>#:First_Name#</div>"
                  };

Kendo UI ListView DataSource无法正常工作

1 个答案: