Q&A
###前提・実現したいこと
spring boot で、thymeleafをテンプレートとして勉強しています。
参考資料：SpringBootﾌﾟﾛｸﾞﾗﾐﾝｸﾞ入門
そこで、構文・インライン・レイアウトの中で、thymeleafの挙動がどうもおかしいように
思いましたので、質問させていただきました。
###発生している問題・エラーメッセージ
参考書：１６０〜１６１ページのHeloController.javaとindex.htmlを参考書をみて 実装してみましたが、うまく条件式の結果が表示されません。 <p th:text ="${id} + ' is ' + ${check} ? ${trueVal} : ${falseVal}"></p> の箇所で、idを1001で渡しているのですが、${check}ではfalseが入り${falseVal}が判定されると思いますが、${trueVal}が、返却される状態です。 また、${id} + ' is ' + を記述しているのに対し、左記が表示されず、${trueVal}の値だけが webに表示される現象になっています。
###該当のソースコード
JAVA8_131
1▪️：HeloController.java 2 3import org.springframework.stereotype.Controller; 4import org.springframework.web.bind.annotation.PathVariable; 5import org.springframework.web.bind.annotation.RequestMapping; 6import org.springframework.web.servlet.ModelAndView; 7 8@Controller 9public class HeloController { 10 11 @RequestMapping("/{id}") 12 public ModelAndView index(@PathVariable int id, ModelAndView mav) { 13 mav.setViewName("index"); 14 mav.addObject("id", id); 15 mav.addObject("check", id % 2 == 0); 16 mav.addObject("trueVal", "Even Number!"); 17 mav.addObject("falseVal", "Odd numbr..."); 18 return mav; 19 } 20} 21 22▪️：index.html 23<!DOCTYPE html> 24<html xmlns:th="http://www.thymeleaf.org"> 25 26 <head> 27 <link th:substituteby="common/head :: common_link" /> 28 <title>top page</title> 29 </head> 30 <body> 31 <h1 th:text = "#{content.title}">Helo page</h1> 32 <p th:text ="${id} + ' is ' + ${check} ? ${trueVal} : ${falseVal}"></p> 33 </body> 34</html>
###試したこと
デバックなどで、値など確認しましたが、${check}にはfalseが入っているのも確認しました。
また、<p th:text ="${id} + ' is ' + ${check} ? ${trueVal} : ${falseVal}"></p>を<p th:text ="${check} ? ${trueVal} : ${falseVal}"></p>で、確認した結果、
うまく、${falseVal}の判定処理されweb上にも、Odd numbr...が表示されました。
結果、${id} + ' is ' + の部分が入ることによって挙動がうまく動いていないように思うのですが
原因がわからず、こちらに質問させていただきました。
###補足情報(言語/FW/ツール等のバージョンなど)
回答1件
0
ベストアンサー
googleブックスのプレビューで参考資料を見てみましたが、書籍の誤りだと考えられます。
結論から言うと以下の記載にするときちんと動きます。
html
1<p th:text ="${id} + ' is ' + (${check} ? ${trueVal} : ${falseVal})"></p>
以下、挙動についての考察
html
1"${id} + ' is ' + ${check} ? ${trueVal} : ${falseVal}"
この条件式ですが、「『${check}』がtrueだったら」ではなく、「『${id} + ' is ' + ${check}』がtrueだったら」と解釈されていると思われます。
公式のドキュメントの記載を上げられず申し訳ありません。
少し検証して見ました。
ケース1. 条件式に文字列を渡してみる
html
1<th:object th:with="check='aiueo',trueVal='trueStr',falseVal='falseStr'"> 2<p th:text ="${check} ? ${trueVal} : ${falseVal}"></p> 3</th:object>
三項演算子の条件のところに「aiueo」という文字列を渡してみます。
この場合出力は以下のようになりました。
html
1trueStr
ケース2. 条件式に真偽値を表す文字列を渡してみる
html
1<th:object th:with="check='false',trueVal='trueStr',falseVal='falseStr'"> 2<p th:text ="${check} ? ${trueVal} : ${falseVal}"></p> 3</th:object>
三項演算子の条件のところに「false」という文字列を渡してみます。
この場合出力は以下のようになりました。
html
1falseStr
ケース3. 条件式にnullを渡してみる
html
1<th:object th:with="check=null,trueVal='trueStr',falseVal='falseStr'"> 2<p th:text ="${check} ? ${trueVal} : ${falseVal}"></p> 3</th:object>
次に三項演算子の条件のところに「null」を渡してみます。
この場合出力は以下のようになりました。
html
1falseStr
以上のことからThymeleafは、文字列を条件式として渡した場合その文字列が予約語の類でなければ全てtrue、nullであればfalseと解釈しているように見えます。
これを踏まえて書籍の記載を見直してみると「${id} + ' is ' + ${check}」は「1001 is false」という文字列と解釈され、それを条件式に渡しているので上記のケース1と同じくtrueとみなされているのだろうと考えられます。
公式の記載は誰か探してください・・・
投稿2017/08/17 01:22
総合スコア433
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2017/08/17 03:55
2017/08/17 04:17