带有模板的Dojo小部件,在小部件加载时更改模板(添加DOM元素)

Dojo widget with template, change template on widget load (add DOM element)

本文关键字:小部 添加 DOM 元素 Dojo 加载      更新时间:2023-09-26

我想用一个非常简单的html模板创建一个dojo小部件:

<div id="contentExternal"></div>

然后在小部件加载上,我想从外部服务加载某些url。然后在url被加载后,我想让一个withsrc参数等于这个加载的url。我写过:

dojo.provide("dojoModules.ExternalWebsitePane");
dojo.require("dijit._Widget");
dojo.require("dijit._Templated");
dojo.require("dojoModules.ConfigurationPane");
dojo.declare("dojoModules.ExternalWebsitePane", [dijit._Widget, dijit._Templated],
    {
        templateString: dojo.cache("dojoModules", "templates/ExternalWebsitePane.html"),
        widgetsInTemplate: false,
        constructor: function() {
        }
        ,
        startup: function() {
            //Get Config
            var serviceParams = new Object();
            serviceParams.ServiceType = "GetConfig";
            ecm.model.Request.invokePluginService("ExternalWebsitePlugin", "ExternalWebsiteService",
                    {requestParams: serviceParams, requestCompleteCallback: function(response) {
                            iframe = new Object();
                            iframe.src = response.configuration.value;
                            iframe.class = "iframe1";
                            var content = document.getElementById('contentExternal');
                            content.appendChild(iframe);
                        }});
        }
    });

但是在

上代码执行失败
var content = document.getElementById('contentExternal');
content.appendChild(iframe);

表示内容为空。我怀疑div从html模板还没有加载。我应该如何添加一个元素?还是什么时候?

通常当您有模板化的小部件时,您应该使用Dojo附加点。如果您有以下模板(例如):

<div data-dojo-attach-point="contentExternalNode"></div>
然后,您可以从与附加点同名的属性访问该节点,例如:
this.contentExternalNode.appendChild(iframe);

我通常在小部件的postCreate中做这些事情(我不知道它是否已经在startup中可用)。这里有一篇关于编写自己的小部件(以及更多关于模板化小部件的信息)的文章。

注意:如果您使用Dojo 1.6,您需要使用dojoAttachPoint属性,而不是data-dojo-attach-point