2015-05-18 65 views
2

我無法獲得我的html屏幕上的劍道網格。它不顯示任何錯誤,但不顯示外部。數據源不綁定到劍道網格

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

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

 
    <div ng-controller="CustomerController"> 
 
     <!--<kendo-grid options="mainGridOptions"> 
 

 
     </kendo-grid>--> 
 

 
     <div ng-controller="CustomerController" id="myKendoDemos" kendo-grid k-data-source="gridData" k-columns="gridColumns"></div> 
 
    </div> 
 

 

 
    <link href="Content/kendo/2014.2.716/kendo.common.min.css" rel="stylesheet" /> 
 
    <link href="Content/kendo/2014.2.716/kendo.default.min.css" rel="stylesheet" /> 
 
    <link href="Content/bootstrap.min.css" rel="stylesheet" /> 
 

 
    <script src="Scripts/jquery-1.10.2.min.js"></script> 
 
    <script src="Scripts/angular.min.js"></script> 
 
    <script src="http://cdn.kendostatic.com/2014.3.1119/js/kendo.all.min.js"></script> 
 
    <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.20/angular-route.min.js"></script> 
 

 
    <!--<script src="Scripts/kendo/2014.2.716/kendo.grid.min.js"></script> 
 
    <script src="Scripts/kendo/2014.2.716/kendo.core.min.js"></script>--> 
 

 

 
    <script> 
 
     var app = angular.module("KendoDemos", ["ngRoute"]); 
 
     app.controller("CustomerController", function ($scope) { 
 

 
      $scope.gridData = [ 
 
       { 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", 
 
       width: "120px" 
 
      }, { 
 
       field: "customerName", 
 
       title: "customerName", 
 
       width: "120px" 
 
      }]; 
 

 
     }); 
 

 

 
    </script> 
 
</body> 
 
</html>

+0

爲什麼你的'CustomerController'嵌套在另一個裏面? – azium

+0

o ..thats錯誤....我刪除that..still相同的問題 –

回答

0

首先,因爲你正在使用kendo-gridk-data-sourcek-columns它們的指令,你需要添加kendo.directives作爲一個應用程序依賴

var app = angular.module("KendoDemos", ["ngRoute", "kendo.directives"]); 

這裏的一個Working Plunk Kendo Grid使用您的選項。希望這有助於