Play framework 2. ajax 回调中的渲染模板

Question

我有渲染评论的模板，comment.scala.html:

@(date: String, text: String, name: String)
...
<h4>@name</h4>  
<p>@date</p>  
<div>@comment</div>

评论也添加到页面 ajax、sendcomment.js:

$("#commentForm").submit(function () {
        jsRoutes.controllers.Posts.addComment($("#blogpostContainer").data("post-id")).ajax({
            success: function (data) {

              //here i populate data with js - my current solution
              var commentHtml = "<li><h4>" + data.name + ... +</li>"

              //but i want use comment template for populating data

                $("#commentsContainer").append(commentHtml);
                $('#commentForm').each(function () {
                    this.reset();
                });
            },
            error: function () {
                alert("Error!")
            },
            data: $("#commentForm").serialize()
        })
        return false;
    }
)

我知道，我不能将 Scala 变量（服务器端）与 JS 变量（客户端）混合使用。
我的问题 - 如何使用 html 模板呈现 ajax 回调？

Answer 1

就像变量一样，Scala 模板也是在服务器端呈现的。

您可以：

渲染 HTML 服务器端和 return AJAX 调用
使用客户端模板库（有很多）

Answer 2

为了扩展@Ryan 的回答，以 Scala 形式重用 comment.scala.html 的唯一方法是 return HTML 而不是 JSON.

优点

代码重用
类型安全

缺点

可能会增加带宽使用，如果 HTML 的大小 > JSON)

为此，您的控制器方法将类似于此伪代码，不包括错误检查等。我假设 Java，但 Scala 版本的逻辑是相同的。

public static F.Promise<Result> addComment() {
    return F.Promise.promise(() -> convert POST data to a comment object)
                    .map(comment -> comment.save())
                    .map(comment -> ok(comment.render(comment.date, 
                                                      comment.text,
                                                      comment.userName)));
}

你的Java脚本看起来像

$("#commentForm").submit(function () {
  jsRoutes.controllers.Posts.addComment($("#blogpostContainer").data("post-id")).ajax({
    success: function (data) {
      $("#commentsContainer").append(commentHtml);
      $('#commentForm').each(function () {
        this.reset();
      });
    },
    error: function () {
      alert("Error!")
    },
    data: $("#commentForm").serialize()
  })
  return false;
})

Play framework 2. ajax 回调中的渲染模板

Play framework 2. Rendering template inside ajax callback

playframework

playframework-2.0

playframework-2.3