【问题标题】:KendoTreeView and AngularJS: icons are not displayedKendoTreeView 和 AngularJS:图标不显示
【发布时间】:2014-11-14 21:34:36
【问题描述】:

知道为什么图标没有显示in this tree吗?

这是 HTML:

  <div kendo-tree-view="tree" k-data-source="treeData" k-options="treeOptions"></div>

这是 CSS:

  #tree .k-sprite {
        background-image: url("http://demos.telerik.com/kendo-ui/content/web/treeview/coloricons-sprite.png");
      }

   .rootfolder { background-position: 0 0; }
   .folder { background-position: 0 -16px; }

这是javascript;

  $scope.treeData = new kendo.data.HierarchicalDataSource({
            data: [
                { text: "Furniture", icon: "folder", items: [
                    { text: "Tables & Chairs", icon: "folder" },
                    { text: "Occasional Furniture", icon: "folder" }
                ] },
                { text: "Decor", icon: "folder", items: [
                    { text: "Bed Linen", icon: "folder" },
                    { text: "Carpets", icon: "folder" }
                ] }
            ]
        });


  $scope.treeOptions = {
        dataSpriteCssClassField: "icon"
  };

【问题讨论】:

    标签: css angularjs kendo-ui kendo-treeview


    【解决方案1】:

    在您的 DOM 中没有 ID 为 tree 的内容。

    尝试将#tree 切换为.k-treeview,图标将显示:

    Plunker illustrating this here

    【讨论】:

    • 谢谢。 kendo-tree-view="tree" 中的 tree 不是可以像在 $scope.tree 中那样使用的句柄吗?我还以为是 DOM id。
    • 不!我相信,Kendo 将允许您通过id: 设置它,但是由于原始 Telerik radControls 中引入的一些问题,它会尝试避免插入 ID(那里的总体意见,我不为 Telerik 工作)。跨度>
    • 谢谢。顺便说一句,你的 plunk 在 FF 中不起作用,只有 Chrome 和 IE
    • 我修复了示例,现在它可以在 FF 中使用,我将
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2016-12-04
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-12-16
    • 2016-12-28
    相关资源
    最近更新 更多