Question

我是EJS的新手，我希望在单击按钮时用EJS渲染的数据动态创建div时需要一些帮助。在我的快递文件中：

res.render("user/profile.ejs", { posts: req.user.posts });
//posts is an array with elements having a similar structure to
/*"posts":[
    {
        "_id":{"$oid":"5cf9072b74cc8310803c89df"},
        "type":"Story",
        "subject/genre":"somethin",
        "content":"another thing",
        "date":{"$date":{"$numberLong":"1559824171334"}}
    }
]*/

在我的ejs文件中：

<div class="row">
    <div class="col">
        <div style="float: right">
            <button type="button" class="btn btn-dark btn-sm m-1 loadPosts-btn" id="All" style="width: 60px">All</button>   
            <button type="button" class="btn btn-dark btn-sm m-1 loadPosts-btn" id="Idea" style="width: 60px">Ideas</button>    
            <button type="button" class="btn btn-dark btn-sm m-1 loadPosts-btn" id="Story" style="width: 60px">Stories</button>
        </div>
    </div>
</div>

<script>
$(document).ready(function(){
        $(".loadPosts-btn").click(function(){
            $(".posts-row").remove();
            if($(this).attr("id") === "All"){
                <% posts.forEach(elem=>{ %>
                    document.getElementsByClassName("container")[0].innerHTML += 
                        `<div class="row posts-row" style="border: 1px solid black">
                            <div class="col">
                                <div class="post-container m-4 p-3">
                                    <h2>${elem.type}</h2>
                                    <h4>${elem["subject/genre"]}</h4>
                                    <p>${elem.content}<p>
                                    <small>${elem.date}</small>
                                </div>
                            </div>
                        </div>`
                <% }) %>    
            };
        });
        $("#All").click();

    });
</script>

它显示错误：elem is not defined。我认为这很正常，因为我没有将elem传递给render()。简而言之，我要在单击带有<div class="row">的按钮时向posts数组中的每个帖子添加一个id="All"。我不知道应该在<script>标签中还是在没有<div class="row">标签的<script>下执行此操作。

谢谢。

在脚本标签之间使用EJS

0 个答案: