Thyemleaf 嵌套迭代触发 org.thymeleaf.exceptions.TemplateInputException。

huangapple go评论83阅读模式
英文:

Thyemleaf nested iteration triggers org.thymeleaf.exceptions.TemplateInputException

问题

以下是已翻译的内容:

我正在尝试迭代通过对象列表并且每个 4 个对象生成一个 div class="card-deck",并且为每个对象生成一个嵌套的 div class="card"

这是在 第234行 生成异常的代码。

更新: 注意:第234行html 中被提及,并且由于 ${#numbers.sequence(0,3} 处缺少 ),出现了 <!-- Error-Line 234 -->

<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)} ">   <!-- Error-Line 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="'Random Generated QR Code'"></p>
            <h6 align="center" th:text="${qr.qrcodestring}"></h6>

        </div>
    </div>
</div>

org.thymeleaf.exceptions.TemplateInputException: 在模板解析过程中发生错误(模板:“class path resource [templates/qrcodes.html]” - 第234行,第10列)

我已经查阅了以下主题:

并且浏览了以下文档:

但仍然无法找到一个不触发异常的合适方法。

更新: 异常已解决,我尝试实现的逻辑没有预期的结果:

上述片段的结果:

Thyemleaf 嵌套迭代触发 org.thymeleaf.exceptions.TemplateInputException。

假设有8张桌子,table1、table2 ... table8,我正在尝试为每4个或5个桌子生成一个 &lt;div class="card-deck"。由于 &lt;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++) {
    if (i % 4 == 0) {
        System.out.println();
        System.out.print("Deck:");
    }
    System.out.print("Card" + (i + 1) + " ");
}

输出:

Thyemleaf 嵌套迭代触发 org.thymeleaf.exceptions.TemplateInputException。

这是我的 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";
}
英文:

I'm trying to iterate through a list of objects and generate a div class=&quot;card-deck&quot; every 4 objects and a nested div class=&quot;card&quot; 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 &lt;!-- Error-Line 234 --&gt; due to a missing ) at ${#numbers.sequence(0,3}

    &lt;div class=&quot;card-deck&quot; th:each=&quot;qr: ${objects}&quot; th:if=&quot;${qr.tableid}%4==0&quot;&gt; &lt;!-- Iterate every 4 objects --&gt;

    &lt;!--syntax error missed clossing ) at ${#numbers.sequence(0,3) triggered the exception here --&gt;
    &lt;div class=&quot;card&quot; th:each=&quot;i : ${#numbers.sequence(0,3)} &quot;&gt;   &lt;!-- Error-Line 234 --&gt;


        &lt;!-- Some More Code --&gt;
        &lt;img th:src=&quot;${qr.qrcodestaticpath}&quot; class=&quot;card-img-top&quot; alt=&quot;...&quot;&gt;
        &lt;div class=&quot;card-body&quot;&gt;
            &lt;h5 class=&quot;card-title&quot; align=&quot;center&quot; th:text=&quot;&#39;Table &#39;+${qr.tableid}&quot;&gt;&lt;/h5&gt;
            &lt;p class=&quot;card-text&quot; align=&quot;center&quot; th:text=&quot;&#39;Random Generated QR Code&#39;&quot;&gt;&lt;/p&gt;
            &lt;h6 align=&quot;center&quot; th:text=&quot; ${qr.qrcodestring}&quot;&gt;&lt;/h6&gt;

        &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;

> 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

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:

Thyemleaf 嵌套迭代触发 org.thymeleaf.exceptions.TemplateInputException。

Imagine there are 8 tables, table1, table2 ... table8 , i'm trying to generate a &lt;div class=&quot;card-deck&quot; ... for every 4 or 5 tables. Due to &lt;div class=&quot;card&quot; th:each=&quot;i : ${#numbers.sequence(0,3)} &quot;&gt; 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 snippet

int numOfObjects=11;
	for(int i=0 ;i&lt;numOfObjects;i++)
	{
		if(i%4==0)
		{
		   System.out.println();
		   System.out.print(&quot;Deck:&quot;);
		}
		  System.out.print(&quot;Card&quot;+(i+1)+&quot; &quot;);    
     }

Output:

Thyemleaf 嵌套迭代触发 org.thymeleaf.exceptions.TemplateInputException。

This is my Controller

@GetMapping(&quot;/qrcodes&quot;)
	  public String greetingForm(Model model) {
	
		List&lt;QrObject&gt; 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(&quot;objects&quot;, qr);
	    model.addAttribute(&quot;decks&quot;,decks);
	    model.addAttribute(&quot;cards&quot;,posa_periseuoun);
	    model.addAttribute(&quot;size&quot;, numOfobj);
	    return &quot;qrcodes&quot;;
	  }

答案1

得分: 2

以下是我翻译的部分:

End Result

跳转到最终结果,这将在浏览器中显示以下文本:

牌组:卡片1 卡片2 卡片3 卡片4
牌组:卡片5 卡片6 卡片7 卡片8
牌组:卡片9 卡片10 卡片11

更实用的是,HTML 如下:

<div class="card-deck">
    <span>牌组: </span>
    <span class="card">卡片1 </span>
    <span class="card">卡片2 </span>
    <span class="card">卡片3 </span>
    <span class="card">卡片4 </span>
</div>
<div class="card-deck">
    <span>牌组: </span>
    <span class="card">卡片5 </span>
    <span class="card">卡片6 </span>
    <span class="card">卡片7 </span>
    <span class="card">卡片8 </span>
</div>
<div class="card-deck">
    <span>牌组: </span>
    <span class="card">卡片9 </span>
    <span class="card">卡片10 </span>
    <span class="card">卡片11 </span>
</div>

Java 对象

牌组(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;
    }
    
}

卡片(Card):

public class Card {
    
    private final String cardName;

    public Card(String cardName) {
        this.cardName = cardName;
    }
    
    public String getCardName() {
        return cardName;
    }

}

组装牌组

Map<String, Object> model = new HashMap();
        
// 这相当于您的 findAll()...
List<Card> allCards = new ArrayList();
for (int i = 1; i <= 11; i++) {
    allCards.add(new 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.getCards().addAll(deckCards);
        decks.add(deck);
        deckCards.clear();
    }
}
        
model.put("decks", decks);

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>

我已经按照您的要求将翻译部分提供给您了。如有任何问题,请随时告知。

英文:

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:

&lt;div class=&quot;card-deck&quot;&gt;
    &lt;span&gt;Deck: &lt;/span&gt;
    &lt;span class=&quot;card&quot;&gt;Card1 &lt;/span&gt;
    &lt;span class=&quot;card&quot;&gt;Card2 &lt;/span&gt;
    &lt;span class=&quot;card&quot;&gt;Card3 &lt;/span&gt;
    &lt;span class=&quot;card&quot;&gt;Card4 &lt;/span&gt;
&lt;/div&gt;
&lt;div class=&quot;card-deck&quot;&gt;
    &lt;span&gt;Deck: &lt;/span&gt;
    &lt;span class=&quot;card&quot;&gt;Card5 &lt;/span&gt;
    &lt;span class=&quot;card&quot;&gt;Card6 &lt;/span&gt;
    &lt;span class=&quot;card&quot;&gt;Card7 &lt;/span&gt;
    &lt;span class=&quot;card&quot;&gt;Card8 &lt;/span&gt;
&lt;/div&gt;
&lt;div class=&quot;card-deck&quot;&gt;
    &lt;span&gt;Deck: &lt;/span&gt;
    &lt;span class=&quot;card&quot;&gt;Card9 &lt;/span&gt;
    &lt;span class=&quot;card&quot;&gt;Card10 &lt;/span&gt;
    &lt;span class=&quot;card&quot;&gt;Card11 &lt;/span&gt;
 &lt;/div&gt;

The Java Objects

The Deck:

public class Deck {

    private final String deckName;
    private final List&lt;Card&gt; cards = new ArrayList();
    
    public Deck(String deckName) {
        this.deckName = deckName;
    }

    public List&lt;Card&gt; 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&lt;String, Object&gt; model = new HashMap();
        
// this is equivalent to your findAll()...
List&lt;Card&gt; allCards = new ArrayList();
for (int i = 1; i&lt;= 11; i++) {
    allCards.add(new Card(&quot;Card&quot; + i));
}
        
int maxCardsPerDeck = 4;        
List&lt;Deck&gt; decks = new ArrayList();
        
Deck deck;
List&lt;Card&gt; deckCards = new ArrayList();
int cardCount = 0;
for (Card card : allCards) {
    cardCount++;
    deckCards.add(card);
    if (cardCount % maxCardsPerDeck == 0 ||
            cardCount == allCards.size()) {
        deck = new Deck(&quot;Deck&quot;);
        deck.getCards().addAll(deckCards);
        decks.add(deck);
        deckCards.clear();
    }
}
        
model.put(&quot;decks&quot;, 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

&lt;div class=&quot;card-deck&quot;
     th:each=&quot;deck: ${decks}&quot;&gt;
    &lt;span th:text=&quot;${deck.deckName + &#39;: &#39;}&quot;&gt;
    &lt;/span&gt;
    &lt;span class=&quot;card&quot;
          th:each=&quot;card: ${deck.cards}&quot;
          th:text=&quot;${card.cardName + &#39; &#39;}&quot;&gt;
    &lt;/span&gt;
&lt;/div&gt;

I used &lt;span&gt;s here, just so things are aligned. You can use whatever you need, and provide the CSS styling you need also.

huangapple
  • 本文由 发表于 2020年4月9日 06:44:27
  • 转载请务必保留本文链接:https://go.coder-hub.com/61111220.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定