javascript - 尝试在 JsRender 中使用 allowedCode 和 {{* window.counter++ }} 并使用 bool 测试测试结果

Question

我有以下模板

    <script type="text/x-widget-template" id="genericRowValues">
        {{* window.counter = 0}}
        {{props}}
            {{* console.log(counter == 0)}}
            {{if counter == 0}}
                {{* console.log("WHY YOU NO WORK!")}}
                <div class="row">
            {{/if}}
            <div class="col-lg-4">
                <div class="input-group" style="margin-bottom:5px;">
                    <b>{{>key}}</b>
                    <div class="well well-sm">
                        {{>prop}}
                    </div>
                </div>
            </div>
            {{if counter == 4}}
                {{* counter = 0}}
                </div>
            {{/if}}
            {{* counter++ }}
        {{/props}}
    </script>

我正在通过创建我的模板。

    var templateSource = $.templates(
        templateName,
        {
            markup: '#' + templateName,
            allowCode: true
        }   
    );

    for (var i = 0; i < dataSource.length; i++) {
        var template = templateSource.render(dataSource[i]);

我也在页面加载时调用它。

    $.views.settings.allowCode = true;

声明:

{{if counter == 0}}

还有:

{{if counter == 4}}

没有像我期望的那样工作。我在这里做错了什么吗？

我的控制台日志显示比较是正确的。然而条件括号内的日志永远不会被击中。 :(

我的日志记录还显示计数器正在正确递增。

这可能是显而易见的事情，但我看不到它:(。

Answer 1

您正在修改 window.counter，但在 bool 测试中您没有查看 window.counter 的值。 {{:counter}} 和 {{if counter}} 正在访问当前数据项的 counter 属性的值 - 即对象 {key : ..., prop:...} 因为您处于 {{props ...}} 的上下文中。

基本上，您无法从常规标签访问全局变量 - 只能从 {{*...}} 和 {{*:...}}

所以你可以做类似 {{* if (window.counter==4) { }} ... {{* } }} 的事情。

参见http://www.jsviews.com/#allowcodetag