如何使用angularjs将Kendo网格绑定到json数据

时间:2015-06-13 12:34:26

标签: angularjs kendo-ui

我正在使用kendo网格将数据与json和angularjs绑定 这是我的代码如下。 这是下面的.cshtml页面代码。

#footerlogos a {
     margin-left: 15px; 
}

#footerlogos img {
     opacity: 0.6; 
     vertical-align: middle; 
}

并且在名为EmployeeController的控制器中,我使用了如下的json数据:

<div ng-app="Sample" ng-controller="SampleController">
    <div>Products: {{products.length}}</div>
    <div kendo-grid k-data-source="products" k-selectable="'row'"
         k-pageable='{ "pageSize": 2, "refresh": true, "pageSizes": true }'
         k-columns='[
        { "field": "EmployeeKey", "title": "EmployeeId"},
        { "field": "FirstName", "title": "First Name"},
        { "field": "LastName", "title": "Last Name"},
        { "field": "DepartmentName", "title": "Department Name" },
         { "field": "EmailAddress", "title": "Email Id" }
      ]'>
    </div>
</div>
<script>
    var app = angular.module('Sample', ['kendo.directives']);
    app.controller('SampleController', function ($scope, $http) {
        debugger;
        $http.get('~/api/Employee/Employee_Read').success(function (thisdata) {
           
            var myData = $.parseJSON(JSON.parse(thisdata));
            $scope.myData = myData;
        });

        $scope.filterOptions = {
            filterText: '',
            useExternalFilter: true,
        };
        });
</script>

这段代码与@HtmlKendo网格工作正常,但为此我无法显示数据。 哪里我错了? 请从这里帮助我。

1 个答案:

答案 0 :(得分:0)

在这种情况下使用kendo.data.ObservableArray

$http.get('~/api/Employee/Employee_Read').success(function (thisdata) {       
    var myData = $.parseJSON(JSON.parse(thisdata));
    $scope.products= new kendo.data.ObservableArray(myData.Data);
});