Javascript 如何在js小部件中为剑道模板提供数据，该小部件也是控件的模板

当我试图以某种方式使用剑道模板时，我没有运气。我已经将kendoTreeView封装在jquery ui.plugin中。我已经为treeview定义了模板，我正在尝试先向小部件内的模板提供数据，然后再通过treeview的项目模板向模板提供更多数据。有没有办法做到这一点

我知道我正在挂断treeview图像脚本标记的模板定义-->

当前，树视图在渲染时的外观如下所示：

检查员在F12中显示：

---

如果模板未添加到HTML中，我认为您不需要脚本标记。此外，还应转义不应从第一个模板计算的#字符。出于某种原因，href中的#字符也需要大量转义：

"<img src='#=data.imageRootUrl#\\#: item.NodeImage \\#.png'  alt=''/> <a href='\\\\\\#' id= '' class='entity-link' >\\#: item.NodeText \\#</a>"

“”

使用格式而不是模板来添加imageRootUrl可能更简单：

"<img src='{0}#: item.NodeImage #.png'  alt=''/> <a href='\\#' id= '' class='entity-link' >#: item.NodeText #</a>"

that.navScriptTemplate = kendo.format(that._templates.navScriptTemplate, that.options.imageRootUrl);

“”
that.navScriptTemplate=kendo.format（that.\u templates.navScriptTemplate，that.options.imageRootUrl）；

太好了，谢谢！字符串文字起作用。对我来说，#有点困惑，但你的回答解决了我的问题。

(function ($) {

    var kendo = window.kendo,
    ui = kendo.ui,
    Widget = ui.Widget;

    var myReusableTreeview = Widget.extend({

        init: function (element, options) {
            var that = this;
            Widget.fn.init.call(this, element, options);
            that._create();
        },
        options: {
            imageRootUrl: "",
            serviceRootUrl : "",
            name: "myReusableTreeview "
        },

        _create: function () {
            var that = this;
            ...

            template = kendo.template(that._templates.divTreeView);
            that.divTreeview = $(template({ id: "treeview1" }));
            ... 

            that.ds1 = new kendo.data.HierarchicalDataSource({
            transport: {
                read: {
                    url: that.options.serviceRootUrl,
                    dataType: "json",
                    data: addData1,
                }
                },
                schema: {
                    model: {
                        id: "NodeID",
                        hasChildren: "HasChildren"
                    }
                }
            });  
            ...
            template = kendo.template(that._templates.navScriptTemplate);
            that.navScriptTemplate = $(template({ imageRootUrl: that.options.imageRootUrl }));
            that.element.append(that.navScriptTemplate);

            $(that.divTreeview1).kendoTreeView({
                dataSource: that.ds1,
                dataTextField: "NodeText",
                template: kendo.template($(that.navScriptTemplate).html())
        });  

        },
        _templates: {
            divWrapper: "<div style='overflow:auto;clear:both;'><div class='treeviewAttach'></div></div>",
            divAttach: "<div></div>",
            divTreeView : "<div id='#=data.id#' style='float: left;position: relative;width: 300px;min-height: 510px;margin: 0;padding: 0;'></div>",
            navScriptTemplate: "<script id='myReusableTreeviewTemplate' type='text/kendo-ui-template'><img src='#=data.imageRootUrl##: item.NodeImage #.png'  alt=''/> <a href='\#' id= '' class='entity-link' >#: item.NodeText #</a></script>"      
        }
    });
    ui.plugin(myReusableTreeviewTemplate);
})(jQuery);

"<img src='#=data.imageRootUrl#\\#: item.NodeImage \\#.png'  alt=''/> <a href='\\\\\\#' id= '' class='entity-link' >\\#: item.NodeText \\#</a>"

"<img src='{0}#: item.NodeImage #.png'  alt=''/> <a href='\\#' id= '' class='entity-link' >#: item.NodeText #</a>"

that.navScriptTemplate = kendo.format(that._templates.navScriptTemplate, that.options.imageRootUrl);