在模板

Question

我使用ejs放在一起的数据渲染页面。当用户按下提交按钮时，应使用提交的新数据和旧数据刷新页面的部分（thirdRow）。我在数据库中获得了新数据，我想刷新显示所有评论的thirdRow。

基本上我的问题是success中的$.ajax方法。我可以获得所有数据，但在html字符串中编写所有内容似乎很奇怪。应该有更好的方法。

我看到了一种方法，我可以将.thirdRow放入模板并将其包含在主EJS页面中，并将其放入我的静态公共文件夹中，并在这种情况下执行类似new EJS({url : 'public/thirdRow.ejs' }).update('.thirdRow', data);的操作最后一个代码片段中的data是从AJAX成功回调中返回的数据吗？如何访问EJS ejs有很多链接可以显示我如何包含EJS

我不知道这是不是正确的方法。你会怎么做？我有一个页面基本上由所有返回的数据组成，我想点击一个按钮，只有一个部分有新数据。

main.ejs中的一个部分

    <div class="thirdRow">
        <div class="reviewSection">
            <% if(reviews){%>
            <% reviews.forEach(function(e, i){%>
            <div class="indivReview">
                <div class = "userRow row">
                    <div>
                        <span>user </span>
                        <% if( e.username) {%>
                        <span><%= e.username %></span>
                        <%}else{ %>
                            <span><%=e.user%></span>
                         <% }%>                        
                    </div>

                    <div><%= e.momented %></div>

               </div><!--userRow-->

               <div class = "companyRow row">
                    <div>
                        <span>Experince for</span>
                        <span><%=e.companyName%></span>
                    </div>
                    <div>
                        <span> industry</span>
                        <span>online retail</span>

                    </div>
               </div> <!--companyRow -->
               <div class="voteRow row">
                    <div>
                        Vote
                    </div>
                    <div><%= e.vote%></div>
               </div>
               <div class="reviewRow row">
                    <div>Review</div>
                    <div class = "displayReview">
                    <% e.reviewText.split("\n").forEach(function(e){ %>
                            <%= e %><br>
                    <%})%>
                    </div>
               </div>
               <div class="statementRow ">
                // make a div for each object
                   <% e.statements.forEach(function(obj){%>
                   <div class="indivStatement">
                        <% var arr = []%>
                        <%for(var prop in obj) {%>
                            <% if(prop !== "name"){ %>
                                <% if(prop == "question"){%>
                                    <% arr[0] = obj[prop] %>
                                <%} %>
                                <% if (prop == "result"){%>
                                   <% arr[1] = obj[prop] %>
                                <%}%> 
                                <% console.log(arr) %>



                            <%} %>


                        <%}%>
                        <div class = "question"><%= arr[0]%></div> 
                        <div class = "bar" data-result ="<%= arr[1]%>"><%= arr[1]%></div> 
                    </div>
                   <%})%>
               </div>
                <div> <span></span>
                <span><%=e.companyName%></span></div>
                <div><%= e.momented %></div>

            </div>
            <%})%>

            <%}%>          
        </div> <!--reviewSection-->

    </div> <!--thirdRow-->

在客户端脚本中

$(".submitButton").on("click",function(){
    console.log(datum)
    var empty;
    if(datum.reviewText == "" && Object.keys(datum.statements) == 0 && datum.vote == null){
        empty = true;
    }else{
        empty = false;
    }
    console.log("empty : " , empty)
    scrollFunction(".thirdRow", ".submitButton, .shareButtonSection")
    var data = datum;
    if(!empty){
        $.ajax({
            type : "POST",
            data : JSON.stringify(data),
            contentType : "application/json",
            url : "http://localhost:4000/submitreview",
            success : function(data){
                console.log("success")
                $(".thirdRow").fadeOut(800, function(){
                    console.log("this", $(this))
                    $(this).html(data).fadeIn().delay(200)
                })
                console.log(data)
            }
        })           
    }
})

我从未在客户端使用过EJS。总是和快递一起使用

Answer 1

以下是使用EJS客户端的示例 https://github.com/tj/ejs/blob/master/examples/client.html