Question

我创建了一个基于小部件的模板，如

<div class="content">
    <div>
        <!-- rest of content-->
    </div>
    <div class="col-md-6">
        <div class="panel" data-dojo-attach-point="sysinfo">
                <ul class="col-md-12 stats">
                    <li class="stat col-md-3 col-sm-3 col-xs-6">Host:</br> <span><b class="value">{{hname}}</b></span>
                    </li>
                    <li class="stat col-md-3 col-sm-3 col-xs-6"># CPU:</br> <span><b class="value">{{cpu}}</b></span>
                    </li>
                </ul>
        </div>
    </div>
 </div>

如何仅更新sysinfo的内容？

直到现在我在做，

var widget =  this;
widget.template = new dtl.Template(widget.templateString);
var template = widget.template;
template.update(node, stats); // but it update complete content as node == content. I just want to refresh sysinfo.

我也试过了，

template.update(this.sysinfo, stats); // but it throws exceptions

有什么想法吗？

Answer 1

据我所知，当您按照文档中的建议使用dojox/dtl/_Templated时，没有update()功能可用。

如果您真的希望某些事情，您必须手动定义模板并渲染该模板（并替换附加点），例如：

var subtemplate = "<ul data-dojo-attach-point='sysinfo'>{% for item in list %}<li>{{item}}</li>{% endfor %}</ul>";
var template = "<div><h1>{{title}}</h1>" + subtemplate + "</div>";

var CustomList = declare("custom/List", [ _WidgetBase, _Templated, _DomTemplated ], {
    templateString: template,
    subTemplate: new dtl.Template(subtemplate),
    title: "Fruits",
    list: [ 'Apple', 'Banana', 'Lemon' ],
    _setListAttr: function(list) {
        this.list = list;
        this.sysinfo = domConstruct.place(this.subTemplate.render(new dtl.Context(this)), this.sysinfo, "replace");
    },
    _getListAttr: function(list) {
        return this.list;
    }
});

通常，如果您在设置列表时更新模板，则可以使用this.render()函数中的_setListAttr()来更新整个模板。

但是，正如您在_setListAttr()函数中看到的那样，我用新渲染的Django模板替换了附加点。

这导致只更新模板的那一部分，而不是整个模板。因此即使更改，{{title}}仍将是原始值。

可以在JSFiddle上找到完整的示例：http://jsfiddle.net/pb3k3/

Dojo仅更新模板的一部分

1 个答案: