angularjs - 在 Angular JS 框架中从 Kendo Treeview 中检索所选项目的最佳方法

Question

我正在将 Kendo UI Treeview 小部件集成到我的基于 Angular 的应用程序中(使用 asp.net mvc4 框架)。
我正在寻求有关检索树的所选项目的最佳方法的建议，因为我不确定我这样做的方式 - e.sender._current.text(); - 是否是最佳实践。

在我下面的 html div 中，您会注意到 k-on-change="vm.onTreeSelect(kendoEvent)" 以及 function onTreeSelect(e) 中相关的 js 事件。

我发现 http://kendo-labs.github.io/angular-kendo/#/TreeView 的当前文档有点薄弱，所以我目前正在寻找两件事:

1) 从 Treeview 中获取当前选择项的最佳方式。

2) 我怎么知道我什么时候到达了树的底部。

提前感谢您的建议，请在下面找到一些代码片段...

我的 html 片段是:

  <div class="widget-content text-left text-info">
         Selected: {{vm.selected}}
         <span id="treeview" kendo-tree-view="tree"
             k-options="vm.treeOptions"
             k-data-source="vm.hierarchy"                                                   
             k-on-change="vm.onTreeSelect(kendoEvent)">
         </span>
  </div>

我的 javascript 代码中的一个片段是:

 (function () {
   'use strict';
   var controllerId = 'dashboard';
   angular.module('app').controller(controllerId, ['common', 'datacontext', dashboard]);
   vm.hierarchy = [];
   vm.onTreeSelect = onTreeSelect;
   vm.treeOptions = {
        checkboxes: {
            checkChildren: true
        }
    };
   vm.selected = null;

   activate();

    function activate() {
        var promises = [getHierarchy(), getCountries()];
        common.activateController(promises, controllerId)
            .then(function () { log('Activated Dashboard View'); });
    }

   function dashboard(common, datacontext) {

        function onTreeSelect(e) {
            vm.selected = e.sender._current.text();            
        }
  })();

Answer 1

获取数据项的最佳方法是:

var dataItem = e.sender.dataItem(e.sender.select());

这将为您提供带有所有数据的项目。确保在更改事件时调用它。这会起作用，因为 e.sender 实际上是 angular 中的 Kendo Treeview ，而其他方法是标准的。还将 kendoEvent 作为事件参数传递。