Scala/Twirl 变量和范围/定义

Question

我是一名前端工程师，但我被要求加入一个利用 Play 框架（包括 Twirl）的 Scala 项目。我正在尝试创建一个模板，该模板根据传入的字符串显示略有不同的输出。

这是我的代码：

@(status: String)(implicit messages: Messages)

@{
    if(status == "00") {
        val pageTitle = "Page title"
        val appStatus = "className"
        val title = "message"
        val subTitle = "message"
        val step1Status = "className"
        val step2Status = "className"
        val step3Status = "className"
        val image1 = "/customs/assets/images/image.png"
        val image2 = "/customs/assets/images/image.png"
        val image3 = "/customs/assets/images/image.png"
        val optionalHeading = ""
        val optionalParagraph = ""
        val listContents = "<li>@Messages('message')</li><li>@Messages('message')</li>"
        val optionalLink = "<br /><a class='button' href='@routes.DashboardController.display(custom)' role='button'>@Messages('message')</a>"
    }

    if(status == "01") {
        //Other variables
    }
    if(status == "04") {
        //Etc...
    }
}

@layout(${pageTitle}) {
        <div class="content__body">
            <div class="hero">
                <div class="${appStatus}">
                    <h1 class="bold-large">@Messages(${title})</h1>
                    <p>
                        ${afterSubTitle}
                    </p>
                    <ol class="appstatus-steps">
                        <li><span class="${step1Status}"><img alt="Complete" title="Complete" src=" + ${image1} + ">@Messages("messages.Received")</span></li>
                        <li><span class="${step2Status}"><img alt="Complete" title="Complete" src=" + ${image2} + ">@Messages("messages.Processing")</span></li>
                        <li><span class="${step3Status}"><img alt="Complete" title="Complete" src=" + ${image3} + ">@Messages("messages.Decision")</span></li>
                    </ol>
                </div>
            </div>

            ${optionalHeading}
            ${optionalParagraph}

            <h2>@Messages("messages.next")</h2>

            <ul class="list list-bullet">
                ${listContents}
            </ul>

            ${optionalLink}
        </div>
    }

因此，如您所见，这个想法是使用代码（状态）调用此页面，并基于该字符串定义了许多变量，这些变量改变了页面的形成方式；内容/css 类/图像等。

这不起作用（你可能会惊讶地发现！）

我真的不清楚为什么它没有。我以为您使用 ${Variable} 格式访问变量，但您可能应该使用 @Variable 格式。

即使我尝试将它们更改为 @Variable 方式，我仍然遇到问题，我大致了解这与 Scala/Twirl 中的范围有关，并且可以使用“定义”关键字。我已经阅读了一些文档，但我没有得到它。

有人能解释一下吗？

编辑

好的，我们只考虑下面的代码：

@(status: String)(implicit messages: Messages)

@{
    if(status == "00") {
        val myClass = "custom-class-1"
    }
    if (status == "01") {
        val myClass = "custom-class-2"
    }
@layout("page title") {
    <div class="@myClass">This is a div</div>
}

所以“我想做的一切”:) 是能够根据状态定义各种变量，然后在页面的模板中使用这些变量。

这有意义吗？我对 Scala 很陌生，所以目前我对元组/定义很陌生，但我正在学习！

Answer 1

您似乎更习惯于 javascript 变量和范围 :)

在 Scala 和 Twirl 中，如果你只在 if 语句中定义一个变量（在这种情况下它是一个值，因为它是不可变的），那么该值只能在 if 块中访问

一种解决方案是让 if 语句返回一个包含所有变量的元组，并使用赋值操作的强大功能，例如：

val (myA, myB, myC) = if(something) {
 val a = "a"
 val b = "b"
 val c = "c"

 (a,b,c) // this will return the 3 variables/values because if statements are an expression, and expressions return something
} else {
 val a = "A"
 val b = "B"
 val c = "C"

 (a,b,c)
}

// now you have a,b,c defined in this scope and you can do whatever you need with them

如果你想根据 if 语句返回不同的变量，你会遇到更多的复杂情况。一个解决方案是使不需要的变量 null 或 Option

如果您需要其他更好的解释，请告诉我:)

EDIT：缩小编辑示例的解决方案

我这里没有任何东西可以检查它是否编译，但它应该是这样的：

@(status: String)(implicit messages: Messages)

@{
    val myClass = if(status == "00") {
        "custom-class-1"
    } else if (status == "01") {
        "custom-class-2"
    } else {
      ""
    }

@layout("page title") {
    <div class="@myClass">This is a div</div>
}

替代使用模式匹配：

将 if/else 语句替换为：

val myClass = status match {
          case "00" => "custom-class-1"
          case "01" => "custom-class-2"
          case _ => ""
        }

（case _ 就像“在其他情况下”）

Answer 2

@pedrorijio 的答案几乎完全正确，但最终对我有用的实际代码是这样的：

@myClass = @{status match {
  case "00" => "custom-class-1"
  case "01" => "custom-class-2"
}}

感谢您的帮助！