1

我正在尝试使用 dojo django 模板编写自定义小部件(对话框)。首先,我制作了一个简单的模板,它使用标准模板语法。它工作正常。然后我试图脱轨到 django 模板。这是模板:

<div class="dijitDialog" role="dialog" aria-labelledby="${id}_title">
    <div data-dojo-attach-point="titleBar" class="dijitDialogTitleBar">
        <span data-dojo-attach-point="titleNode" class="dijitDialogTitle" id="${id}_title"></span> 
        <span data-dojo-attach-point="closeButtonNode" class="dijitDialogCloseIcon" data-dojo-attach-event="ondijitclick: onCancel" title="${buttonCancel}" role="button" tabIndex="-1">
            <span data-dojo-attach-point="closeText" class="closeText" title="${buttonCancel}">x</span>
        </span>
    </div>
    <div data-dojo-attach-point="containerNode" class="dijitDialogPaneContent bugViewContent">
            <div data-dojo-type="dijit.layout.TabContainer" style="width: 100%; height: 100%;">
                <div data-dojo-type="dijit.layout.ContentPane" title="Details" selected="true">
                    <span>{{ttt}}</span>
                </div>
                <div data-dojo-type="dijit.layout.ContentPane" title="Attachments">
                    Test
                </div>
                <div data-dojo-type="dijit.layout.ContentPane" title="Core tab">
                    Test
                </div>
                <div data-dojo-type="dijit.layout.ContentPane" title="Corporate tab">
                    Test
                </div>
                <div data-dojo-type="dijit.layout.ContentPane" title="Distribution tab">
                    Test
                </div>
            </div>
    </div>
</div>

和代码:

require([
         "dojo/_base/declare",
         "dojo/ready",
         "dijit/_Widget",
         "dijit/Dialog",
         "dijit/_TemplatedMixin",
         "dojox/dtl/_DomTemplated",
         "dijit/_WidgetsInTemplateMixin",
         "dojo/text!qc_boobster/BugView.html",
         "dijit/layout/TabContainer",
         "dijit/layout/ContentPane"
        ], 
        function(declare, ready, Widget, Dialog, TemplatedMinxin, DtlDomTemplated, WidgetsInTemplateMixin, template) {
            declare("qc_boobster.BugView", 
                    [Widget, Dialog, TemplatedMinxin, DtlDomTemplated, WidgetsInTemplateMixin],
                    {
                        templateString : template,

                        ttt : "test",

                        setBug : function(aBug) {
                            console.log("BugView.setBug(");
                            console.log(aBug);
                            console.log(")");
                        },
                    });

            ready(function() {
            });
        }
);

我这样称呼它:

xhr.get({
    url : "ajax/bugs/" + id,
    handleAs : "json",
    load : function(data) {
        var bugView = new qc_boobster.BugView();

        bugView.setBug(data);
        bugView.show();
    }
});

当我尝试以编程方式实例化小部件时,我收到以下错误:You cannot use the Render object without specifying where you want to render it. 好吧,我查看了 dojo 资源并在dojox.dtl.render.dom. 我在对象(我的小部件)没有设置 domNode 时发生。我已经放置了断点并dojox.dtl._DomTemplated.buildRendering()看到两者都未定义。我尝试在我的小部件中添加几个混合组件(见上文),但它们都没有设置这些属性。我也尝试设置,但后来在官方文档中发现,发生在. 我认为问题在于我以编程方式创建了我的小部件,但不是在现有 DOM 节点的顶部。domNodesrcNodeRefdomNodepostCreate()postCreate()buildRendering()

那么我做错了什么以及如何使它起作用?

4

1 回答 1

1

好像我需要这样的继承:

require([
     "dojo/_base/declare",
     "dojo/ready",
     "dijit/Dialog",
     "dojox/dtl/_Templated",
     "dijit/_WidgetsInTemplateMixin",
     "dojo/text!qc_boobster/BugView.html",
    ], 
    function(declare, ready, Dialog, DtlTemplated, WidgetsInTemplateMixin, template)
        ....
于 2012-04-19T21:11:17.500 回答