如何更改视图上的数据?例如,我有一个页面呈现输入,我在其中写单词,提交(通过按钮或链接)后,我只是在同一页面上获得了该单词的翻译。在我的代码中,我有服务方法translate()
,该方法在数据库中监视单词并获取translatedWord
。我如何渲染该翻译的单词?
@GetMapping("/translate")
public String showTranslateForm() {
return "word-translate";
}
@PostMapping("/translate")
public String translateWord(@ModelAttribute("word") String wordToTranslate, Model model) {
String translatedWord = wordService.translate(wordToTranslate);
model.addAttribute("toTranslate", wordToTranslate);
model.addAttribute("translated", translatedWord);
return "redirect:/translate";
}
而且我需要@ModelAttribute(“ word”)吗?因为我用model.addAttribute
东西?我不明白args中的属性与方法主体之间的良好区别
您的后端可能看起来像这样(下面的说明):
@GetMapping("/translate")
public String showTranslateForm(Model model) {
if (model.getAttribute("toTranslate") != null) {
model.addAttribute("wordToTranslate");
}
if (model.getAttribute("translated") != null) {
model.addAttribute("translated");
}
return "word-translate";
}
@PostMapping("/translate")
public String translateWord(@RequestParam("word") String wordToTranslate,
RedirectAttributes attrs) {
String translatedWord = wordToTranslate.translate(wordToTranslate);
attrs.addFlashAttribute("toTranslate", wordToTranslate);
attrs.addFlashAttribute("translated", translatedWord);
return "redirect:/translate";
}
您可以在前端(使用Freemarker):
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<form action="/translate" method="post">
<input name="word" type="text" />
<input type="submit" value="submit">
</form>
<p>
<#if translated??>
${translated}
</#if>
<#if toTranslate??>
${toTranslate}
</#if>
</p>
</body>
</html>
您将通过在前端的输入中键入内容并单击提交按钮来发送值(在控制器方法中期望的word
。
提交将触发@PostMapping("/translate")
下的方法。该方法将从输入字段中获取值(由于输入属性name=word
的存在,该属性将绑定到此函数中的wordToTranslate
参数,因为它前面有@RequestParam(“ word”)批注)。我们还将RedirectAttributes
注入到此函数中,以便我们可以添加Flash属性,该属性将传递给showTranslateForm
方法。
[当属性传递到showTranslateForm
时,model
现在将包含toTranslate
和translated
键(我们在translateWord
方法中将它们添加为flash属性),现在可以在[ Freemarker模板。顺便说一下,<#if translated??>
和<#if toTranslate??>
if语句只是检查那些属性是否存在(因为当我们第一次进入此页面时它们最初并不存在,因此在重定向之后它们就存在)。
我希望这些信息能帮助您走上正确的轨道!