Question

我在数据对象中有73个项目，我想创建每页最多12个项目的页面视图，我尝试使用jquery模板逻辑来确定何时关闭并打开一个新页面div。原谅任何语法或逻辑错误，我很快就从内存中重写了这个错误。

<script id="listTmpl" type="text/x-jquery-tmpl">

{{if idx == 0}}
    <div class="page">
{{/if}}

        <div class="item mrl">
            <a href="">
                <img src="http://files.stv.tv/img/player/${programmeName}/episodes/${episodeName}-230.jpg" alt="${programmeNiceName}" />
                <h3 class="mln mvs">${programmeNiceName}</h3>
                <p>${idx}</p>
            </a>        
        </div>

{{if idx % 12 == 0}}
    </div>
    <div class="page">
{{/if}}

{{if idx == ($item.getTotal() - 1)}}
    </div>
{{/if}}

</script>

不幸的是在chrome中我遇到以下错误。

未捕获的TypeError：无法调用未定义的方法'push'

我的假设是，在每个项目的某些迭代中，生成的html无效，这会引发错误，任何人都可以建议更好的做事方式或我可能出错的地方。

Answer 1

如果有帮助，我在模板html中有一个未关闭的锚标记时会收到此错误。添加</a>解决了问题。

Answer 2

我的假设是，在每个项目的某些迭代中，生成的html无效，这会引发错误，任何人都可以建议更好的做事方式或我可能出错的地方。

Nope push是Array原型上的一种方法。我的猜测是你试图将值推送到Object或其他类型而不是Array。我无法确定，因为它不是您发布的模板代码，除非您遗漏了该部分。

Answer 3

我很好奇，你不能拥有像 - ＆gt;这样的代码吗？ ??

{{if idx % 12 == 0}}
    <div class="page">
{{/if}}

        <div class="item mrl">
            <a href="">
                <img src="http://files.stv.tv/img/player/${programmeName}/episodes/${episodeName}-230.jpg" alt="${programmeNiceName}" />
                <h3 class="mln mvs">${programmeNiceName}</h3>
                <p>${idx}</p>
            </a>        
        </div>

{{if (idx % 12 == 0 && idx > 0) || idx == $item.getTotal() - 1}}
    </div>
{{/if}}

我现在正在研究另一种方式（一个开源项目）来动态生成HTML，例如，你的情况可能就像操纵一个元素节点树。我希望您能清楚以下代码，

function getYouHTML(allData){
    var t = Tog('div.page'); // new a div node

    for(var i = 0; i < allData.length; i ++){
        var d = allData[i]
        t.Div('.item.mrl')
        .A().href('')
        .img().src("http://files.stv.tv/img/player/", d.programmeName, "/episodes/", d.episodeName, "-230.jpg")
            .alt(d.programmeNiceName)
        .h3(d.programmeNiceName).cls('mln mvs')
        .p(d.idx)
        .close('.item.mrl')

        if(i % 12 == 0){
            t.close('.page').Tog('div.page'); // close it and re-new one if i % 12 == 0
        }
    }

    return t.html();
}

// json = [{idx:0, programmeName: 'name 1', episodeName: ...}, {idx: 1, program... }, {idx: 2, ...} ]
getYouHTML(json);

Answer 4

随着此问题的修复，需要更改jquery模板代码link的第426行

jquery模板组成

4 个答案: