kendo网格不呈现。 [英] kendo grid is not rendering.

查看:131
本文介绍了kendo网格不呈现。的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

大家好,



我正在使用VS2013和剑道专业的新手。我试图使用kendo UI和角度JS渲染一个简单的网格。以下是代码,但由于某种原因不能渲染。请帮助。在此先感谢





hello all,

i am using VS2013 and a newbie in kendo grid professional. i am trying to render a simple grid using kendo UI and angular JS. Following is is the code but it is not rendering for some reason. pls help. thanks in advance


<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>

    <link href="Scripts/kendoui.professional.2015.1.429/styles/kendo.common.min.css" rel="stylesheet" />
    <link href="Scripts/kendoui.professional.2015.1.429/styles/kendo.default.min.css" rel="stylesheet" />
    <link href="Content/kendo/2015.1.429/kendo.common-bootstrap.min.css" rel="stylesheet" />
    <link href="Content/kendo/2015.1.429/kendo.metro.min.css" rel="stylesheet" />
   
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>

    <script src="Scripts/kendoui.professional.2015.1.429/js/kendo.all.min.js"></script>
   
    <script src="Scripts/kendoui.professional.2015.1.429/js/kendo.angular.min.js"></script>

</head>

<body ng-app="KendoDemos">
    <h1>Customer list</h1>

    <div ng-controller="CustomerController" style="width: 100%">

        <!--<div kendo-grid k-options="gridOptions">hello </div>-->
        <div kendo-grid k-data-source="gridData" k-columns="gridColumns">hello </div>


        <h2>Customer list2 </h2>
    </div>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js"></script>
    <script type="text/javascript">
    
        
        angular.module("KendoDemos", []).controller("CustomerController", function ($scope) {

            $scope.gridData = new kendo.data.DataSource({
                data: [
                { customerId: '1', customerName: 'shikhar1' },
                { customerId: '2', customerName: 'shikhar2' },
                { customerId: '3', customerName: 'shikhar3' },
                { customerId: '4', customerName: 'shikhar4' }


                //{
                //dataSource: "http://localhost:58816/api/Values"
                //     }
                ]
            });

            $scope.gridColumns = [
            {
                field: "customerId",
                title: "customerId"
            },
            {
                field: "customerName",
                title: "customerName"
            }
            ];

        });
        
        

    </script>

</body>
</html>

推荐答案

scope){


scope.gridData = new kendo.data.DataSource({
数据:[
{customerId:' 1',customerName:' shikhar1'},
{customerId:' 2',customerName:' shikhar2'},
{customerId:' 3',customerName:' shikhar3' },
{customerId:' 4',customerName:' shikhar4'}


// {
// dataSource: http:// localhost:58816 / api / Values
// }
]
});
scope.gridData = new kendo.data.DataSource({ data: [ { customerId: '1', customerName: 'shikhar1' }, { customerId: '2', customerName: 'shikhar2' }, { customerId: '3', customerName: 'shikhar3' }, { customerId: '4', customerName: 'shikhar4' } //{ //dataSource: "http://localhost:58816/api/Values" // } ] });


scope.gridColumns = [
{
field: customerId
title: customerId
},
{
字段: customerName
title: customerName
}
];

});



< / script >

< / body >
< / html >
scope.gridColumns = [ { field: "customerId", title: "customerId" }, { field: "customerName", title: "customerName" } ]; }); </script> </body> </html>

这篇关于kendo网格不呈现。的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆