对同一元素调用Mustache两次失败

Calling Mustache twice on the same element fails?

本文关键字：两次 失败 Mustache 元素 调用      更新时间：2023-09-26

我有一些代码，它将div的html（）设置为针对特定JSON 的Mustache调用的结果

    function render_bugs(json_file){
        $.getJSON(json_file, function(json) {
        $("#bug-list").html(Mustache.to_html($('#template').html(), json));

第一次调用函数时，它很好。然而，当我用不同的"json_file"调用它时。它失败，并出现以下错误：

haystack is null    
return haystack.indexOf(this.otag + needle) != -1;

我最初认为问题出在JSON文件上，所以我交换了参数名称，但事实并非如此，JSON很好。

然后我添加了一个测试行，我只是在胡子调用之前设置html，就像这样：

    function render_bugs(json_file){
        $.getJSON(json_file, function(json) {
            $('#bug-list').html('<p>foo</p>');
        $("#bug-list").html(Mustache.to_html($('#template').html(), json));

而且根本不起作用。

这就像Mustache不想工作，如果它被渲染到的元素中已经有内容

有办法解决这个问题吗？

解决

这是页面的标记：

        <div id="bug-list" />
        <div id="template">
            <p><strong>{{bugs}}</strong> bugs found in mingle</p>
            {{#repos}}
            <h2>{{repo-name}}</h2>
                <ol>
                    {{#hotspots}}
                        <li>
                        <p class="file-name"><a>{{score}} - {{file}}</a></p>
                            <ol>
                                <li><em><span class="line-number">{{lines}}</span> lines of code</em></li>
                                <li><em><span class="traits">{{traits}}</span> traits mixed in</em></li>
                                {{#commits}}
                                <li>
                                    <strong>{{date}}</strong> - {{message}}
                                    <div class="code">{{{change}}}</div></li>
                                {{/commits}}
                            </ol>
                        </li>
                    {{/hotspots}}
                </ol>
            {{/repos}}
        </div>

事实证明，我用xml短手关闭"bug列表"div并不好。我猜它假设我没有正确关闭它，所以模板div存在于bug列表中。因此，第一个呈现调用将覆盖模板，这将使第二个调用失败。

通过将第一行更改为

<div id="bug-list"></div>

它工作

愚蠢的浏览器

相关文章：