JS + Ajax + Thymeleaf - 从 thymeleaf 上下文访问 JS 值

Question

>我想知道是否有办法从thymeleaf的内联语法中访问JavaScript对象。

我正在尝试使用 JavaScript 中的[[@{}]]语法构建一个 URL。但是，在 URL 内部，我需要访问 JS 变量。

代码如下：

var fieldPathStr = /*[[@{{lessonId}/questions/{questionId}(lessonId=${lesson.id}, questionId=question.id)}]]*/"1/questions/2";

具体来说，question.id是JS变量，但它（显然）只是将最终URL创建为：

1/questions/question.id

有没有办法构建此赋值语句，以便我可以获取question.id的实际值并使其正确评估它？

Answer 1

您可以像这样提取值：

var lessonId = [[${lesson.id}]];
var questionId = [[${question.id}]];

但我不确定这是一条路。如果您正在使用列表，则需要在 js 中提取它们，这意味着机器端的工作量是两倍......有一种方法可以做到这一点，但可能与您想象的几乎没有什么不同！我如何管理弹出框以确认从列表中删除项目的示例：

<script th:inline="javascript">
    function deleteObject(id) {
        bootbox.confirm([[#{msg.ask}]], function(result) {
            if (result) {
                var url = /*[[ @{'/admin/vozila/izbrisi?vin='} ]]*/ "genericUrl";
                url = url+id;
                document.location = url;
            }
        }); 
    };
</script>

完成此操作后，您只需要调用它并传递对象 id：

<a class="btn btn-default btn-sm" href="#" th:onclick="'javascript:deleteObject('' + ${vozilo.vin} + '');'"><i class="glyphicon glyphicon-remove"></i><span th:text="#{rad.obr}">Radnja - izbrisi</span></a>

因此，您不会在 js 中呈现百里香叶，而是在调用时将值传递给函数。我想在你的情况下，它看起来像这样：

<script th:inline="javascript">
function callLink(lessonID, questionID){
var fieldPathStr = lessonID+/*[[@{'/questions/'}]]*/"1/questions/2";
var finalStr = lessonID+fieldPathStr+questionID;
};
</script>

其中问题 ID 和课程 ID 应如下所示：

<a href="#" th:onclick="'javascript:callLink('' + ${lesson.id} + '', '' + ${question.id} + '');'"></a>

希望这对你有用吗？