在 KendoGrid 模板中使用函数

Question

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 }];

}

Answer 1

对于 kendo 模板，#= something # 语法用于将值呈现为 HTML，因此您不能调用这样的函数。

省略 = 符号，只使用＃某物＃执行任意 javascript

参见：http://docs.telerik.com/kendo-ui/framework/templates/overview

Answer 2

您可以使用 angular 模板表达式，例如 {{ }} 以及 kendo 表达式，例如 #= #。对于您的示例，请尝试：

$scope.gridOptions = {
   columns: [
      { field: "code" },
      {
        field: "name",
        template: '{{ getName(dataItem.code) }}'
      }
   ]
};
$scope.getName = function(code) {
  return "This code is " + code;
};

查看此演示：http://dojo.telerik.com/@pesho/iMASa/2

在 KendoGrid 模板中使用函数

Using a function in a KendoGrid template

kendo-ui

angularjs