我试图在Angular Controller中获取Kendo网格的实例,因此我可以尝试挂接一些事件(和调用方法),我知道这可能不是最佳实践(应该使用自定义指令),但是根据文档,我们应该可以使用...
<div ng-app="app" ng-controller="MyCtrl">
<input kendo-datepicker="datePicker" k-on-change="onChange()">
</div>
<script>
angular.module("app", [ "kendo.directives" ]).controller("MyCtrl",
function($scope) {
$scope.onChange = function() {
alert($scope.datePicker.value());
};
});
因此,我试图对网格进行同样的操作。我有以下标记...
<div ng-controller="Grid">
<div kendo-grid='grid' k-options="vm.gridOptions"></div>
</div>
然后在控制器js文件中。
angular
.module("mygrid")
.controller("Grid", ['$scope', Grid]);
function Grid($scope) {
var gridInstance = $scope.grid;
...
可以在这里看到
但是,gridInstance始终是未定义的。有谁知道我是否应该使用网格来做到这一点?如果是,为什么上面的代码总是返回undefined?
预先感谢您的任何帮助
彼得
两个问题:
kendo-grid="vm.grid"
使用kendo-grid="grid"
因此,您的HTML变为:
<div data-ng-app="app">
<div data-ng-controller="Grid as vm">
<div kendo-grid="vm.grid" k-options="vm.options"></div>
<div>{{vm.msg}}</div>
</div>
</div>
您的应用程序:
(function () {
angular.module("app", ["kendo.directives"])
.controller("Grid", ["$scope", Grid]);
function Grid($scope) {
var vm = this;
var gridData = [{
col1: 'data1',
col2: 'data2'
}, {
col1: 'data1',
col2: 'data2'
}];
vm.options = {
dataSource: gridData,
editable: true
};
$scope.$on("kendoRendered", function (event) {
var gridInstance = vm.grid;
console.log(vm);
vm.msg = gridInstance === undefined ? "undefined" : "defined";
});
}
})();
(更新的演示)
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句