scala - 为什么我不能在 Play Framework 2 View 中将 Scala 代码与 HTML 混合？

Question

我制作了一个示例，该示例应该读取 JSON 文件并在 Play Framework 2.2 的常规 View 中以 HTML 形式呈现其数据。

View 如下所示:

@(json: play.api.libs.json.JsValue)

@import play.api.libs.json._

@main("JSON Read") {

    <h1>JSON Read</h1>

    <p>This sample reads a JSON file containing some book categories and a few books inside these categories.</p>
    <!-- THIS WORKS -->
    <p>This link demonstrates a route with parameter: <a href="@routes.JsonSamples.bookdetails("12345678")">Link to book 12345678</a></p>

    @json.as[List[JsObject]].map { section =>
        <table>
            <caption>
                <h2>@{(section \ "title").as[String]}</h2>
                <p>@{(section \ "description").as[String]}</p>
            </caption>
            <thead>
                <tr>
                    <th>Book Title</th>
                    <th>Description</th>
                </tr>
            </thead>
            <tbody>
        @{(section \ "entries").as[List[JsObject]].map { entry =>
                <tr>
                    <td>
                        <!-- By the way... I can't even use @* *@ comments here. Why? -->

                        <!-- I DON'T KNOW WHAT TO PUT INTO HREF, NOTHING WORKS, SEE BELOW -->
                        <a href="#">
                            {(entry \ "title").as[String]}
                        </a>

                        <!-- THIS WORKS -->
                        (ID: {(entry \ "id").as[String]})
                    </td>
                    <td>
                        <p>{(entry \ "description").as[String]}</p>
                        <p>Order link: {(entry \ "link").as[String]}</p>
                    </td>
                </tr>
        }}
            </tbody>
        </table>
    }

}

在中间的某个地方，您可以看到我尝试为每本书插入生成的链接，但我根本无法在 href="" 标记的 <a> 属性内打印任何内容。我尝试过:

Attempt 1:
<a href="@routes.JsonSamples.bookdetails((entry \ "id").as[String])">
...Compilation error: unclosed multi-line string literal

Attempt 2:
<a href="@(routes.JsonSamples.bookdetails((entry \ "id").as[String]))">
...Compilation error: in XML literal: whitespace expected

Attempt 3:
<a href="@{routes.JsonSamples.bookdetails((entry \ "id").as[String])}">
...Compilation error: in XML literal: whitespace expected

Attempt 4:
<a href="{routes.JsonSamples.bookdetails((entry \ "id").as[String])}">
...Compilation error: in XML literal: whitespace expected

有时您可以简单地使用 @ 符号来显示数据。

有时您必须使用 @ 并用 {} 包装代码(即 @{…} )。

有时甚至不允许 @ ，您只能使用 {} 。

有时这些方法都不起作用。

很明显，它必须与代码是否位于另一个代码块内这一事实有关。但是(可能在大多数情况下)所有内容都被包装到 @main {…} 中并且它可以工作，但是包装的代码块越多，显示值似乎就越困难。

所以，主要的具体问题是:如何显示上面当前仅显示 href="#" 的链接/路由？

更普遍的问题是:是否有一种清晰易懂的方法如何将代码与 HTML 混合？

JSON 文件:https://github.com/Manc/play-samples/blob/json/data/books.json

Controller :https://github.com/Manc/play-samples/blob/json/app/controllers/JsonSamples.scala

View :https://github.com/Manc/play-samples/blob/json/app/views/jsonsamples/read.scala.html

我还注意到，即使是 @* *@ 注释 block 也不允许在 View 中的任何地方使用。

我来自 PHP，总是很清楚什么是 PHP 代码，什么不是。甚至，例如Laravel(一个 PHP 框架)模板引擎 Blade 使用类似的方法，您可以在代码中与 @ 符号或 {{ … }} 混合以打印变量/函数/方法的值或 {{{ … }}} 执行相同的操作但 HTML 安全转义了。

Answer 1

首先是一个快速修复

@for(entry <- (section \ "entries").as[List[JsObject]]) {
  <tr>
    <td>
      <a href="@routes.JsonSamples.bookdetails((entry \ "id").as[String])">
        @{(entry \ "title").as[String]}
      </a>
    </td>
    <td>
      <p>@{(entry \ "description").as[String]}</p>
      <p>Order link: @{(entry \ "link").as[String]}</p>
    </td>
  </tr>
}

您的代码的问题在于使用了@{...}。问题是，该 block 内的所有内容都被视为 scala 代码。这就是为什么 @**@ 注释不起作用，它们不是有效的 scala 语法。 Scala 有 xml 文字，允许在里面使用 html 标签。

这意味着我们需要摆脱循环内部的 scala 语法。问题是，我找不到一种方法来做到这一点并保留 map 语法。因为 @(section\"entries").as[List[JsObject]].map {entry => 中的 section\"entries" 两边有括号，所以模板引擎仅将该部分视为 scala 代码。要解决这个问题，您可以使用 for 的替代语法。

因此，对于简单的表达式，请使用@。使用 @{...} 来表示不那么简单的表达式，但请记住 block 内的所有内容都是 scala 代码(因此不再需要 @)。不能使用 @ 的地方是在 scala 代码中。

当简单的表达式不够并且您需要执行map或其他操作时，这可能会导致问题，但总有defining帮助器，您应该'无论如何，不​​要在模板中做太复杂的事情。