胸腺叶嵌套迭代触发org.thymeleaf.exceptions.TemplateInputException [英] Thyemleaf nested iteration triggers org.thymeleaf.exceptions.TemplateInputException
问题描述
我正在尝试遍历对象列表,并为每个 4
个对象生成一个 div class ="card-deck"
和一个嵌套的 div类="card"
用于每个对象.
这是在第234行
上生成异常的代码 更新:注意:第234行在 html
中提到,并具有<!-错误行234-->
,因为在 $ {#numbers.sequence(0,3}
)
< div class ="card-deck" th:each ="qr:$ {objects}" th:if ="$ {qr.tableid}%4 == 0><!-每4个对象进行迭代-><!-语法错误未在$ {#numbers.sequence(0,3)处闭合)在此处触发了异常->< div class ="card" th:each ="i:$ {#numbers.sequence(0,3)}"><!-错误线234-><!-更多代码->< img th:src ="$ {qr.qrcodestaticpath}" class ="card-img-top" alt ="...">< div class ="card-body">< h5 class ="card-title" align ="center" th:text ='Table'+ $ {qr.tableid}"></h5>< p class ="card-text" align ="center" th:text ='随机生成的QR码'"></p>< h6 align ="center" th:text ="$ {qr.qrcodestring}"></h6></div></div></div>
org.thymeleaf.exceptions.TemplateInputException:模板解析期间发生错误(模板:类路径资源[templates/qrcodes.html]"-第234行,列10)
我已经讨论过这些主题
-
想象一下,有8个表,table1,table2 ... table8,我试图为每4或5个表生成一个
< div class ="card-deck" ...
.由于< div class ="card" th:each ="i:$ {#numbers.sequence(0,3)}">
,我得到了4个相同的表.-
qr.tableid
是表号,从1到x
出于演示目的,请看一下此
java
代码段int numOfObjects = 11;for(int i = 0; i< numOfObjects; i ++){如果(i%4 == 0){System.out.println();System.out.print("Deck:");}System.out.print("Card" +(i + 1)+");}
输出:
这是我的
Controller
@GetMapping("/qrcodes")公共字符串greetingForm(模型模型){列表< QrObject>qr = qrRepo.findAll();int numOfobj = qr.size();内部甲板if(numOfobj%4 == 0)卡座= numOfobj/4;别的卡座=(numOfobj/4)+1;int posa_periseuoun = numOfobj%4;model.addAttribute("objects",qr);model.addAttribute("decks",decks);model.addAttribute("cards",posa_periseuoun);model.addAttribute("size",numOfobj);返回"qrcodes";}
解决方案这是我认为代表您正在尝试做的一种方法.
最终结果
跳转到最终结果,这将在浏览器中显示以下文本:
卡座:Card1 Card2 Card3 Card4甲板:Card5 Card6 Card7 Card8甲板:Card9 Card10 Card11
更有用的是,HTML如下:
< div class ="card-deck">< span>甲板:</span>< span class ="card"> Card1</span>< span class ="card"> Card2</span>< span class ="card"> Card3</span>< span class ="card"> Card4</span></div>< div class ="card-deck">< span>甲板:</span>< span class ="card"> Card5</span>< span class ="card"> Card6</span>< span class ="card"> Card7</span>< span class ="card"> Card8</span></div>< div class ="card-deck">< span>甲板:</span>< span class ="card"> Card9</span>< span class ="card"> Card10</span>< span class ="card"> Card11</span></div>
Java对象
甲板:
公共类Deck {私有最终String deckName;私人最终List< Card>卡=新的ArrayList();公共Deck(String deckName){this.deckName = deckName;}公共列表< Card>getCards(){归还卡;}公共字符串getDeckName(){返回deckName;}}
卡片:
公共类别卡{私人最终String cardName;公共卡(字符串cardName){this.cardName = cardName;}公共字符串getCardName(){返回卡名;}}
组装甲板:
Map< String,Object>模型= new HashMap();//这等效于您的findAll()...列出<卡>allCards = new ArrayList();对于(int i = 1; i< = 11; i ++){allCards.add(new Card("Card" + i));}int maxCardsPerDeck = 4;List< Deck>卡座=新的ArrayList();甲板甲板列出<卡>deckCards = new ArrayList();int cardCount = 0;用于(卡卡:allCards){cardCount ++;deckCards.add(card);如果(cardCount%maxCardsPerDeck == 0 ||cardCount == allCards.size()){甲板=新的Deck("Deck");deck.getCards().addAll(deckCards);decks.add(deck);deckCards.clear();}}model.put(甲板",甲板);
上面的代码相当粗糙-可能可以改进.但关键是:它会组合一个牌组集合,每个牌组所包含的牌数不得超过允许的最大牌数(在此示例中为4个).
胸腺
< div class ="card-deck"th:each ="deck:$ {decks}">< span th:text ="$ {deck.deckName +':'}"></span>< span class ="card"th:each ="card:$ {deck.cards}"th:text ="$ {card.cardName +''}"></span></div>
我在这里使用了
< span>
s,只是为了保持一致.您可以使用所需的任何内容,并提供所需的CSS样式.I'm trying to iterate through a list of objects and generate a
div class="card-deck"
every4
objects and a nesteddiv class="card"
for every object.This is the code that generates the exception on line 234
UPDATE: Note: line 234 is mentioned in
html
and had the<!-- Error-Line 234 -->
due to a missing)
at${#numbers.sequence(0,3}
<div class="card-deck" th:each="qr: ${objects}" th:if="${qr.tableid}%4==0"> <!-- Iterate every 4 objects --> <!--syntax error missed clossing ) at ${#numbers.sequence(0,3) triggered the exception here --> <div class="card" th:each="i : ${#numbers.sequence(0,3)} "> <!-- Error-Line 234 --> <!-- Some More Code --> <img th:src="${qr.qrcodestaticpath}" class="card-img-top" alt="..."> <div class="card-body"> <h5 class="card-title" align="center" th:text="'Table '+${qr.tableid}"></h5> <p class="card-text" align="center" th:text="'Random Generated QR Code'"></p> <h6 align="center" th:text=" ${qr.qrcodestring}"></h6> </div> </div> </div>
org.thymeleaf.exceptions.TemplateInputException: An error happened during template parsing (template: "class path resource [templates/qrcodes.html]" - line 234, col 10)
I've already been on these topics
- How to do if-else in Thymeleaf?
- Thymeleaf Loop Until a Number
- nested (double) loop with thymeleaf
- Thymeleaf - How to loop a list by index
and gone through this documentation
and still can't figure a proper way of doing it , without triggering an
exception
UPDATE: Exception is fixed, the logic i'm trying implementing doesn't have the desired outcome:
Outcome of the above snippet:
Imagine there are 8 tables, table1, table2 ... table8 , i'm trying to generate a
<div class="card-deck" ...
for every 4 or 5 tables. Due to<div class="card" th:each="i : ${#numbers.sequence(0,3)} ">
I get the 4 same tables.qr.tableid
are the table numbers, 1 to x
For purposes of demonstration take a look at this
java
snippetint numOfObjects=11; for(int i=0 ;i<numOfObjects;i++) { if(i%4==0) { System.out.println(); System.out.print("Deck:"); } System.out.print("Card"+(i+1)+" "); }
Output:
This is my
Controller
@GetMapping("/qrcodes") public String greetingForm(Model model) { List<QrObject> qr =qrRepo.findAll(); int numOfobj= qr.size(); int decks; if(numOfobj % 4==0) decks = numOfobj / 4 ; else decks = (numOfobj / 4) +1 ; int posa_periseuoun = numOfobj % 4 ; model.addAttribute("objects", qr); model.addAttribute("decks",decks); model.addAttribute("cards",posa_periseuoun); model.addAttribute("size", numOfobj); return "qrcodes"; }
解决方案Here is an approach which I think represents what you are trying to do.
End Result
Jumping to the end result, this will display the following text in a browser:
Deck: Card1 Card2 Card3 Card4 Deck: Card5 Card6 Card7 Card8 Deck: Card9 Card10 Card11
More usefully, the HTML is as follows:
<div class="card-deck"> <span>Deck: </span> <span class="card">Card1 </span> <span class="card">Card2 </span> <span class="card">Card3 </span> <span class="card">Card4 </span> </div> <div class="card-deck"> <span>Deck: </span> <span class="card">Card5 </span> <span class="card">Card6 </span> <span class="card">Card7 </span> <span class="card">Card8 </span> </div> <div class="card-deck"> <span>Deck: </span> <span class="card">Card9 </span> <span class="card">Card10 </span> <span class="card">Card11 </span> </div>
The Java Objects
The Deck:
public class Deck { private final String deckName; private final List<Card> cards = new ArrayList(); public Deck(String deckName) { this.deckName = deckName; } public List<Card> getCards() { return cards; } public String getDeckName() { return deckName; } }
The Card:
public class Card { private final String cardName; public Card(String cardName) { this.cardName = cardName; } public String getCardName() { return cardName; } }
Assembling the Decks:
Map<String, Object> model = new HashMap(); // this is equivalent to your findAll()... List<Card> allCards = new ArrayList(); for (int i = 1; i<= 11; i++) { allCards.add(new Card("Card" + i)); } int maxCardsPerDeck = 4; List<Deck> decks = new ArrayList(); Deck deck; List<Card> deckCards = new ArrayList(); int cardCount = 0; for (Card card : allCards) { cardCount++; deckCards.add(card); if (cardCount % maxCardsPerDeck == 0 || cardCount == allCards.size()) { deck = new Deck("Deck"); deck.getCards().addAll(deckCards); decks.add(deck); deckCards.clear(); } } model.put("decks", decks);
The above code is fairly crude - it could probably be refined. But the point is: it assembles a collection of decks, with each deck containing no more than the allowed maximum of cards (4 in this example).
The Thymeleaf
<div class="card-deck" th:each="deck: ${decks}"> <span th:text="${deck.deckName + ': '}"> </span> <span class="card" th:each="card: ${deck.cards}" th:text="${card.cardName + ' '}"> </span> </div>
I used
<span>
s here, just so things are aligned. You can use whatever you need, and provide the CSS styling you need also.这篇关于胸腺叶嵌套迭代触发org.thymeleaf.exceptions.TemplateInputException的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
-