嵌套“{{for}}”问题? [jsRender]

时间:2012-07-19 14:29:41

标签: jquery templates jsrender

我正在尝试将模板与jsRender放在一起,而不是我自己的版本,但是,我一直得到这个:“未捕获的JsRender错误:语法错误无法匹配或缺少标记:”{{/ for}}“在模板中:“后跟我的整个模板。

这是我的代码的截断版本,有关于发生了什么的任何想法?或者它只是嵌套的for循环?

<div class="page" id="{{:info.id+info.name}}">
    {{for sources}}
    <header class="feed-title">
        <div class="feed-title-content">
            <span class="feed-title-text">{{:title}}</span>
        </div>
    </header>
    <section class="row">
        <div class="scroll-left"></div>
        <div class="row-scroll">
            {{for articles}}

                          // An if, else and some standard content insertion stuff is/was here

            {{/for}}
        </div>
        <div class="scroll-right"></div>
    </section>
    {{/for}}
</div>

chrome的开发工具的屏幕截图,显示了我的数组结构:

展开视图的屏幕截图1:

Screenshot 1 of an expanded view

崩溃了:

And collapsed

关于发生了什么的任何想法?

编辑:忘记提及,我使用John Papa的code

从外部文件加载

编辑:演示和代码:

我的阵列的Chrome开发工具输出:

Object
    info: Object
    sources: Array[1]
        0: Object
            articles: Array[7]
                0: Object
                1: Object
                2: Object
                3: Object
                4: Object
                5: Object
                6: Object
            link: "http://lifehacker.com"
            title: "Lifehacker"

演示:http://jsfiddle.net/SO_AMK/3J7AE/

一个有效的嵌套数组:

Object
    foo: "names"
    testData: Array[2]
        0: Object
            markup: "<span style='background: yellow'>John</span>"
            name: "John"
            secondary: Array[1]
                0: Object
                1: Object

演示:http://jsfiddle.net/SO_AMK/Vf8Bq/

2 个答案:

答案 0 :(得分:3)

你是对的,问题似乎是你的JavaScript对象。我认为循环的属性需要是数组而不是对象。 Your template works just fine使用您在评论中提供的jsfiddle示例中的testdata。

如果不是这样:你能添加对象的JSON序列化吗?您的模板似乎有效:http://jsfiddle.net/6wcX8/1/

答案 1 :(得分:2)

查看jsfiddles,问题是上面代码中未实际显示的部分中的标记,使用{{if}}和{{else}},没有使用正确的语法:

他们使用了:

{{for articles}}
    {{if img === false }}
        ...
    {{/if}}
    {{else}}
        ...
    {{/else}}
{{/for}}

而不是

{{for articles}}
    {{if img === false }}
        ...
    {{else}}
         ...
    {{/if}}
{{/for}}

请参阅此demo sample of {{if}} and {{each}} tags