时间戳

首页 > 解决方案 > 尝试在 javascript 中对 java 变量使用 .get 方法

javascript - 尝试在 javascript 中对 java 变量使用 .get 方法

问题描述

我正在尝试创建一个网页（使用播放框架），它显示用户的姓名、出生日期等。我遇到困难的地方是试图在 html 页面中显示未知大小的列表。我目前有：

@(currentUser : Profile)

@main("Profile") {
    <div>
        <h1><b>@currentUser.getFirstName() @currentUser.getLastName()</b></h1>
        <p>@currentUser.getDateofBirth</p>
        <b>Nationalities</b>
        <ul><p id="natInput"></p></ul>
        <script>
            for (var i = 0; i < "@currentUser.getNationalities().size()"; i++) {
                document.getElementById("natInput").innerHTML += "<li>" + "@currentUser.getNationalities().get(i)" + "</li>";
            }
        </script>
    </div>
}

Profile 是一个基本的 java 类，它只包含 getter 和 setter，并且 .getNationalities 返回一个 List。@Main 是另一个 html 文件，它存储网站的基本设计，与此无关。

如您所见，我正在尝试使用 .get 方法来遍历用户的国籍列表，但不幸的是，get 中使用的“i”变量无法识别，因为它是 html 中的 javascript 变量。此代码的所有其他部分似乎都按预期工作，当“i”被替换为整数（例如 0 或 1）时，.get 工作。

有什么想法可以获取此列表中的每个单独元素吗？任何帮助将不胜感激

标签： javascriptjavahtmlplayframework

解决方案

问题是你搞乱了页面生成的不同步骤。

首先，我们应该清除从renderPlay 控制器中的命令到浏览器中完全呈现的页面的处理步骤。

Twirl 是一个模板引擎，允许您使用 Scala 生成 HTML 页面。此步骤在服务器端执行，在 HTML 页面发送到浏览器之前。在此步骤中，不考虑 Javascript 代码。

因此，在命令之后的第一步render，选择并渲染 twirl 模板，评估每个 Twirl/Scala 指令。这将生成一个没有更多 Scala 代码的 HTML 文件。

这个生成的页面被发送到浏览器。然后页面被加载到浏览器中，并且 Javascript 代码被评估为任何其他带有 JS 的 HTML 页面。

这可以解释为什么您无法按照您的方式呈现页面。

如果您的页面是静态的，那么正确的方法是仅使用 twirl 指令来迭代数组Twirl Template - Iterating

getNationalities()如果方法返回一个 Scala 列表，您应该能够像下面这样重写您的列表生成

<ul>
@for(nationality <- currentUser.getNationalities()) {
   <li>@nationality</li>
}
</ul>

推荐阅读