In this plunk我有一个AngularJS KendoGrid有两列:代码和名称。代码是一个数字,名称是代码的函数:getName(code)
。我把函数放在模板中,但是我得到了function undefined
。有任何想法吗?
HTML
<div kendo-grid="grid"
k-data-source="ds"
k-options="gridOptions"></div>
使用Javascript
var app = angular.module("app", [ "kendo.directives" ]);
function MyCtrl($scope) {
$scope.gridOptions = {
columns: [
{
field: "code"
},
{
field: "name",
template: '#= getName(code) #'
}]
};
var getName = function(code) {
return "This code is " + code;
};
$scope.ds = [{ code: 1 },
{ code: 2 },
{ code: 3 },
{ code: 4 },
{ code: 5 }];
}
对于kendo模板,#= something#语法用于将值呈现为HTML,因此您无法调用这样的函数。
省略=符号并使用#thing#来执行任意javascript
见:http://docs.telerik.com/kendo-ui/framework/templates/overview
您可以使用角度模板表达式(如{{ }}
)以及kendo表达式(如#= #
)。为您的示例尝试:
$scope.gridOptions = {
columns: [
{ field: "code" },
{
field: "name",
template: '{{ getName(dataItem.code) }}'
}
]
};
$scope.getName = function(code) {
return "This code is " + code;
};