2

I'm working on Odoo 16 and tried to create a custom screen in POS.

Is there any particular reason why the following template is not working in my custom POS screen?

<?xml version="1.0" encoding="UTF-8"?>
<templates id="template" xml:space="preserve">
    <t t-name="ProductTotalSalesScreen" owl="1">
        <t t-set="data_sales" t-value="sales_data"/>
        <div class="top-content">
            <div class="button back" t-on-click="back">
                Back
            </div>
        </div>
        <t t-foreach="[1, 2, 3]" t-as="i">
            <p><t t-esc="i"/></p>
        </t>
    </t>
</templates>

What causes the problem is the t-foreach section. When I remove it, everything works as expected and my screen appears with the back button. As soon as I implement a t-foreach section, then an 'undefined' error appears in my browser console, when I try to display my custom screen.

Generally, I can't use t-foreach in my POS templates and I always get the 'undefined' error.

Does anyone know why? Any hint would be helpful.

1 Answers1

2

Try this if it works for you

<t t-foreach="[1, 2, 3]" t-as="i" t-key="i">
   <p><t t-esc="i"/></p>
</t>
  • You are my god for today! It worked! Any idea why the t-key attribute is necessary? – Panagiotis Anagnostakis Jun 07 '23 at 07:27
  • 1
    Owl requires the presence of a t-key directive, to be able to properly reconcile renderings. t-key directive is used to give an identity to an element. It allows Owl to understand if different elements of a list are actually different or not. – Satish Prajapati Jun 07 '23 at 08:01
  • 3
    @PanagiotisAnagnostakis You can find more details at [owl loops](https://github.com/odoo/owl/blob/master/doc/reference/templates.md#loops) documentation – Kenly Jun 07 '23 at 08:52