Question

{{#each}}中{{#if}}的这个简单示例会产生意外（对我而言）结果：

HTML：

<head>
    <title>test</title>
</head>

<body>
    {{> test yes=true}}
</body>

template name="test">
    {{#if yes}}
        <span>yes</span>
    {{else}}
        <span>no</span>
    {{/if}}
    <ul>
        {{#each testItems}}
            {{#if yes}}
                <li>yes</li>
            {{else}}
                <li>no</li>
            {{/if}}
        {{/each}}
    </ul>
</template>

JS：

Template.test.helpers({
    testItems: [1,2,3]
});

输出：

是

没有
没有
没有

我期待一个包含3 x yes的列表...

这段代码有什么问题？

Answer 1

每个帮助程序中的数据上下文是testItems数组，但您正在尝试访问父上下文的变量（测试模板的数据上下文）。所以自然是yes是未定义的，因此导致if语句评估为false。如果您访问父上下文，则应获得预期结果。

<head>
    <title>test</title>
</head>

<body>
    {{> test yes=true}}
</body>

template name="test">
    {{#if yes}}
        <span>yes</span>
    {{else}}
        <span>no</span>
    {{/if}}
    <ul>
        {{#each testItems}}
            {{#if ../yes}}
                <li>yes</li>
            {{else}}
                <li>no</li>
            {{/if}}
        {{/each}}
    </ul>
</template>

Meteor Spacebars：{{#each}}内{{#if}}会产生意想不到的结果

1 个答案: