jsViews检查长度返回错误

时间:2017-03-30 21:23:03

标签: javascript jsrender jsviews

我正在使用jSViews并通过JSON获取数据,然后链接到模板。

模板显示我发送的数据,但是我有一个带有注释数组的简单帖子模板。

如果我尝试检查数组的长度是否大于0,使用lenth,它会崩溃:

0x800a138f - JavaScript运行时错误:无法获取未定义或空引用的属性“长度”

这是一段代码:

$.getJSON("/students/dashboard/GetDashboardPosts")
.done(function (json) {
    posts_data = json;

    if (posts_data) {
       if (posts_data.length > 0) {                      
            var posts_html = $("#posts-template").render(posts_data);
            $(".posts .row").html(posts_html);

            $.templates("#post-detail-template").link(".single-post-detail .row", post_detail); // post_detail is initially an empty object
        }

    }

$(".post").on("click", "#posts-section", function (event) {
    // get the index of the clicked item - should be able to do this with $.view but it isnt working - check it out.
    var idx = $(this).closest(".dashboard-post").attr("data-index");

    // update it observably so we dont have to traverse the DOM.
    $.observable(post_detail).setProperty(
        (posts_data[idx])
    );
    $("body").addClass("has-overlay");
    $(".single-post-detail").addClass("expanded");

});


script id="post-detail-template" type="text/x-jsrender">
<div class="col s12 m12 l6 post">
    ...
    ...
            {^{if comments.length > 0}}
                {^{include comments tmpl="#post-detail-comments-template"/}}:
            {{/if}}
        </div>
</script>

script id="post-detail-comments-template" type="text/x-jsrender">
<section class="comments-section">
    <ul class="comments-list">
        {^{for #data}}
        <li class="comment-item">
           ...
        </li>
        {{/for}}
    </ul>
</section>

我可以使用帮助程序来破解它:

{^{if ~hasLength(comments)}}
                {^{include comments tmpl="#post-detail-comments-template"/}}:
 {{/if}}

var viewHelpers = {
    hasLength: function (arr) {
        if (!arr) { return false; }

        var x = arr;
        if (x.length > 0) {
            return true;
        }
        return false;

    }
};

$.views.helpers(viewHelpers);

但是我无法理解为什么它给我这个错误理想,我只想包含评论模板如果有评论而不必使用if,但这是我能得到它的唯一方法工作

1 个答案:

答案 0 :(得分:0)

如果post_detail没有comments属性,那么{^{if comments.length}}确实会产生错误。如果您包含“空检查”,它应该有效:

{^{if comments && comments.length > 0}}...{{/if}}