Question

我使用下划线将JSON数据转换为模板：

$(document).ready(function(){
    var template = $("#furniture-template").html();
        $furnitureList = _.template(template, {things: things});
});

正常加载并在正常页面刷新时正常工作。但是当通过ajax加载页面时（使用history.js和ajaxify.js）我得到两个错误：

Error: SyntaxError: syntax error
Source Code: <% _.each(things,function(thing,key,list){ %>

和

Error: TypeError: n is undefined
Source File: http://192.168.0.20:8888/metropolis/library/themes/metropolis/assets/js/plugins/underscore.js

以下是模板脚本。

有没有人有像这样的下划线错误的经验？我应该如何调试这个，或者如果有人能指出我在这里做错了什么，那就太好了。

谢谢！

            <script type="text/html" id='furniture-template'>
                <div class="accordion collapse">
                    <div class="accordion-group">
                        <% _.each(things,function(thing,key,list){ %>

                        <div class="accordion-heading">
                            <a class="accordion-toggle ic-minus block collapsed" data-toggle="collapse" href="#things-<%= thing.slug %>">
                                <%= thing.title %>
                            </a>
                        </div> <!-- header -->

                        <div id="things-<%= thing.slug %>" class="accordion-body collapse">
                            <div class="accordion-inner">
                                <% for(var item in thing.items) { %>
                                <div class="item">
                                    <% if( thing.items[item].images == true ) { %>
                                        <a data-target="<%= thing.items[item].slug %>-gal" class="img-link ic-cam fl" title="View an example"></a>
                                    <% } %>

                                    <a 
                                        class="item-add ic-plus" 
                                        data-title="<%= thing.items[item].title %>" 
                                        data-slug="<%= thing.items[item].slug %>"
                                        data-img="<%= thing.items[item].images %>"
                                        data-shorthand="<%= thing.items[item].shorthand %>"
                                        data-price="<%= thing.items[item].price %>"
                                    >
                                        <%= thing.items[item].title %>
                                    </a>
                                </div>
                                <% } %>
                            </div> <!-- inner -->
                        </div> <!-- accordion-body -->  


                    <% }); %>
                    </div>
                </div>
            </script>

Answer 1

ajaxify脚本在ajax成功时异步加载脚本。问题是它创建的<script>节点没有type或id属性。

以下是来自ajaxify.js

的修订脚本摘录

// Add the scripts
$scripts.each(function(){
    var $script = $(this), 
        scriptText = $script.text(),
        scriptType = $script.attr('type'),
        scriptId = $script.attr('id');

    scriptNode = document.createElement('script');

    if(scriptType) {
        $(scriptNode).attr('type', scriptType);
    }

    if(scriptId) {
        $(scriptNode).attr('id', scriptId);
    }

    scriptNode.appendChild(document.createTextNode(scriptText));
    contentNode.appendChild(scriptNode);
});

通过ajax加载时，下划线模板抛出错误

1 个答案: