0

我一直在寻找一种方法,尽管很老套,将甘特图的任务模板连接到 ObservableObject 以利用 MVVM 系统。我知道编辑模板开箱即用地支持此功能,但是我一直在努力使其也可以与任务模板一起使用。

感谢 Josh Eastburn 和他的小提琴,我发现 Kendo Grid 中的细节模板可以通过 hooking 函数绑定到 MVVM detailInit

$("#a-kendo-grid").kendoGrid({
    detailTemplate: kendo.template( $("#detail-template").html() ),
    detailInit: function(e) {
        kendo.bind(e.detailRow, e.data); // this line produces the binding
    }
})

在实例化 Kendo Gantt 时,我乐观地尝试更改参数名称以引用任务而不是详细模板,但它似乎没有实现。

有没有人遇到过另一个将甘特图的任务模板绑定到 MVVM 的黑客/技巧?

4

1 回答 1

0

我一直在联系 Telerik 支持。他们声明他们没有计划在时间线界面中实现甘特任务与其代表任务模板之间的 MVVM 连接。

但是,我找到了一种创建 MVVM 绑定的 hacky 方法:

HTML

<div id="gantt"></div>
<script id="task-template" type="text/x-kendo-template">
    <div>
        <div>
            <span data-bind="text: title"></span>
        </div>
</script>

JavaScript

$("#gantt").kendoGantt({
  dataSource: dataSource,
  taskTemplate: $("#task-template").html(),
  dataBound: function(e) {
    var htmlElement = null;

    e.sender.dataSource.taskTree().forEach(function( taskObject ){
      htmlElement = $(".k-task[data-uid="+taskObject.uid+"]");

      if( htmlElement.find("[data-bind]").get(0).kendoBindingTarget === undefined ){
        // bind unless previously bound
        kendo.bind( htmlElement, taskObject );
      }
    });
  }
});

在甘特图绑定到新数据后,此代码段会将 DOM 中呈现的任务模板元素与其代表任务对象挂钩。此事件触发,例如:发布第一次加载数据,并且每次用户保存对甘特任务的更改。

于 2016-07-06T06:50:47.673 回答