Question

我刚刚开始使用kendo-ui网格并创建了我的列，所有内容都适用于回来的数据。我尝试将模板值添加到我的列定义中，而kendo文档说我应该能够使用{{dataItem.something}}来访问模板中的值。这不起作用。但是，<span ng-bind='dataItem.something'></span>正常工作。为什么会这样，我怎样才能让花括号绑定工作？谢谢。

以下是我正在做的伪代码片段：

在我的html和控制器中（我省略了所有其他选项，如数据源等）：

this.gridOptions = {
       columns: [ 
        {
          field: 'valueOne',
          template: "<span ng-bind='dataItem.valueOne'></span>" // THIS WORKS
        },
        {
          field: 'valueTwo',
          template: "{{dataItem.valueTwo}}" // THIS DOES NOT WORKS
        }
      ]
    };

<div ng-controller="gridController as vm">   
    <div kendo-grid k-options="vm.gridOptions"></div>
</div>

我正在尝试的是kendo文档和演示：
http://docs.telerik.com/kendo-ui/AngularJS/the-grid-widget#template‌s
http://dojo.telerik.com/ikEKIr

Answer 1

TL; DR; 通过删除kendo-angular.js，绑定正如预期的那样工作。 kendo-angular.js库仍然包含在我们的构建中并且与kendo.all.js冲突

更多： kendo-angular.js库已弃用，支持已移至kendo professional。角度功能被移动到kendo.all.js。文档对于按特定顺序包含库非常具体。包含顺序必须是JQuery，Angular，然后是Kendo。我检查了这一点，并确保尝试所有脚本的最新版本，也尝试使用演示中使用的特定版本。然而，在进一步深入到我们的脚本之后，事实证明我们的构建脚本仍然包括更远的列表中的kendo-angular.js。删除此修复我的问题。

Answer 2

初始化应用程序后，您无法使用角度模板，当您插入新的HTML角度时，将忽略它。

剑道拥有自己的模板标签：

使用哈希语法有三种方法：

将值呈现为HTML：#= #。
使用HTML编码显示值：#: #。
执行任意JavaScript代码：# if (true) { # ... non-script content here ... # } #.

您还可以将函数用作模板：

template:   
    function (e) {
                if (e.type !== 1)
                    return "";
                return '<input type="checkbox"' + (e.canExecute ? 'checked="checked"' : '') + 'disabled="disabled" />';
            }

您还可以查看docs了解详情

具有角度的Kendo UI网格 - 在列模板

2 个答案: