【问题标题】:Why Is Spacebars Template Not Being Completely Rendered?为什么空格键模板没有完全渲染?
【发布时间】:2014-01-21 20:42:47
【问题描述】:

我遇到了一个奇怪的情况,我的模板没有渲染每个字段

非常感谢

'<template name="photog">
<h2>These are {{photographer}}'s stories</h2>

{{#each photog}}

        <img src="{{photos.[0]}}" alt="great image from a story">

        <div class="caption">

            <h3>{{storyName}}</h3>

            <p>Photographer: {{photographer}}</p>

            <p>Editor: <a href="/editor/{{editor}}">{{editor}}</a></p>

        </div>
{{/each}}
</template>'

【问题讨论】:

    标签: templates meteor spacebars


    【解决方案1】:

    摄影师的姓名在模板的 {{#each}} 部分之外不可用,因为从您的 photog 路线查询返回的数据没有顶级摄影师字段:

    {
        "photographer" : "Dean",
        "editor" : "Dean",
        "votes" : 0,
        "photos" : [
            "/pics/wenick_20131110_171.jpg",
            "/pics/wenick_20131110_182.jpg"
        ],
        "storyName" : "D2BS West 2013",
        "_id" : "GCYR9MnYrrvxRSBQB"
    }
    {
        "photographer" : "Dean",
        "editor" : "Dean",
        "votes" : 1,
        "photos" : [
            "/pics/wenick_20130409_149.jpg",
            "/pics/wenick_20130409_158.jpg"
        ],
        "storyName" : "Bill's Party",
        "_id" : "tCrFAm7X6vFSbiadC"
    }
    

    您可以在photog 路由(在client/helpers/router.js)中添加另一个返回的数据值,使其看起来像这样:

    return {
                photog: Stories.find( {photographer: this.params.photographer} ),
                photographer: this.params.photographer
            };
    

    ...然后确保引用摄影师姓名的行(client/views/stories/photog.html)是这样的:

    <h2>These are {{photographer}}'s stories</h2>
    

    【讨论】:

    • 酷。谢谢你。这是有道理的。
    【解决方案2】:

    在未显示的对象上调用整个模板。让所有人都称这个对象为顶部。我假设它看起来像这样:

    {
        "photog": [
            {
                "photographer": "name",
                "editor": "name",
                "photos": []
            },
            {
                "photographer": "name2",
                "editor": "name2",
                "photos": []
            }
        ]
    }
    

    {{#each}} 循环通过调用的 photog 数组。在 each 中,变量范围已更改,以便您可以直接访问 {{photographer}}。

    但是在每个之外,模板应该引用哪个 {{photographer}}?它不知道。一种解决方案是使用模板帮助程序将其硬连接。将这样的内容添加到您的 javascript:

    Template.photog.photographer = function()
    {
        return "the name";
    }
    

    【讨论】:

    • 有趣。谢谢。这不是我所期望的行为,因为每个“photog”的摄影师姓名都相同
    猜你喜欢
    • 2016-04-23
    • 2011-06-21
    • 2014-07-06
    • 2013-07-10
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-09-28
    相关资源
    最近更新 更多