如何在 HTML Table 中连续添加相同名称的值

Question

我有一个变量

rating=[
    {"display_name":"Support","rating":4},
    {"display_name":"Support","rating":5},
    {"display_name":"Support","rating":0},
    {"display_name":"testuser2","rating":0}
]

我需要使用循环在 HTML table 中打印这些数据。

对于每个显示名称，应计算平均评分，例如，支持率应该是 (4+5+0)/2=4.5。 testuser2，评分应为 0

我试过的是：

<table width="100%">
    <thead>
        <tr>
            <th class="billing" width="20%">User Name</th>
            <th class="billing" width="5%">Average Rating</th>

        </tr>
    </thead>

    <tbody>
        {% if(rating.count() > 0) %}
        {% for tran in rating%}
        <tr>
        <td>{{tran.display_name}}</td>

        <td>
            {% if tran.rating > 0%}
            {% set sumrate=0 %}
            {% set n=0 %}
            {% for rate in rating %}
              {% set sumrate=sumrate+rate.rating %}
               {% set n=n+1 %}

            {% endfor %}
            {% endif %}
            {% set avg=sumrate /n %}
            {% if(avg<1 and avg>0)  %}

            <i class="fa fa-star-half-o checked"></i>
            <i class="fa fa-star"></i>
            <i class="fa fa-star"></i>
            <i class="fa fa-star"></i>
            <i class="fa fa-star"></i>
            {% endif %}

            {% if(avg==1)  %}

            <i class="fa fa-star checked"></i>
            <i class="fa fa-star"></i>
            <i class="fa fa-star"></i>
            <i class="fa fa-star"></i>
            <i class="fa fa-star"></i>
            {% endif %}
            {% if(avg<2 and avg>1)  %}

            <i class="fa fa-star checked"></i>
            <i class="fa fa-star-half-o checked"></i>
            <i class="fa fa-star"></i>
            <i class="fa fa-star"></i>
            <i class="fa fa-star"></i>
            {% endif %}
            {% if(avg==2)  %}

            <i class="fa fa-star checked"></i>
            <i class="fa fa-star checked"></i>
            <i class="fa fa-star "></i>
            <i class="fa fa-star"></i>
            <i class="fa fa-star"></i>
            {% endif %}
            {% if(avg<3 and avg>2)  %}

            <i class="fa fa-star checked"></i>
            <i class="fa fa-star checked"></i>
            <i class="fa fa-star-half-o checked "></i>
            <i class="fa fa-star"></i>
            <i class="fa fa-star"></i>
            {% endif %}
            {% if(avg==3)  %}

            <i class="fa fa-star checked"></i>
            <i class="fa fa-star checked"></i>
            <i class="fa fa-star checked"></i>
            <i class="fa fa-star"></i>
            <i class="fa fa-star"></i>
            {% endif %}

            {% if(avg<4 and avg>3)  %}

            <i class="fa fa-star checked"></i>
            <i class="fa fa-star checked"></i>
            <i class="fa fa-star checked"></i>
            <i class="fa fa-star-half-o checked"></i>
            <i class="fa fa-star"></i>
            {% endif %}
            {% if(avg==4)  %}

            <i class="fa fa-star checked"></i>
            <i class="fa fa-star checked"></i>
            <i class="fa fa-star checked"></i>
            <i class="fa fa-star checked "></i>
            <i class="fa fa-star"></i>
            {% endif %}

            {% if(avg<5 and avg>4)  %}

            <i class="fa fa-star checked"></i>
            <i class="fa fa-star checked"></i>
            <i class="fa fa-star checked"></i>
            <i class="fa fa-star checked "></i>
            <i class="fa fa-star-half-o checked"></i>
            {% endif %}
            {% if(avg==5)  %}

            <i class="fa fa-star checked"></i>
            <i class="fa fa-star checked"></i>
            <i class="fa fa-star checked"></i>
            <i class="fa fa-star checked "></i>
            <i class="fa fa-star checked"></i>
            {% endif %}
            {{avg}}
            {% endfor %}
        </td>
        </tr>
        {% else %}
            <tr><td colspan="4"> No listings yet. </td></tr>
        {% endif %}

    </tbody>
</table>

我的输出显示了什么

Output

我需要的输出应该是：

User	Average Rating
Support	4.5
testuser2	0

如何获得我需要的输出？

Answer 1

您必须创建第二个循环，根据显示名称对值进行分组，以便在 twig

中解决此问题

{% set votes  = [
    {"display_name":"Support","rating":4},
    {"display_name":"Support","rating":5},
    {"display_name":"Support","rating":0},
    {"display_name":"testuser2","rating":0}
] %}

{% set grouped_values = {} %}

{% for vote in votes %}
    {% if vote > 0 %}
       {% set key = vote.display_name %} 
       {% set grouped_values = grouped_values|merge({ (key) : (grouped_values[key]|default([])|merge([vote.rating,])),}) %}
    {% endif %}
{% endfor %}

然后你可以使用这个新数组来构建 table

<table width="100%">
    <thead>
        <tr>
            <th class="billing" width="20%">User Name</th>
            <th class="billing" width="5%">Average Rating</th>

        </tr>
    </thead>

    <tbody>
    {% if grouped_values|default([]) %}
        {% for key, votes in grouped_values %}
            {% set sum = 0 %}
            {% for vote in votes %}{% set sum = sum + vote %}{% endfor %}
            {% set avg = votes ? (sum / votes|length) : 0 %}
            <tr>
                <td>{{ key }}</td>
                <td>
                    {% if avg-1 > -1 %}
                        {% for i in 0..avg-1 %}
                            <i class="fa fa-star checked"></i>
                        {% endfor %}
                    {% endif %}
    
                    {% if 5-avg-1 > -1 %}
                        {% for i in 0..(5-avg-1) %}
                            <i class="fa fa-star"></i>
                        {% endfor %}
                    {% endif %}
                
                    {{ avg }}
                </td>
            </tr>
        {% endfor %}
    {% else %}
        <tr><td colspan="4"> No listings yet. </td></tr>
    {% endif %}
    </tbody>
</table>

demo

旁注

考虑在控制器中而不是在模板中分组和计算平均值

如何在 HTML Table 中连续添加相同名称的值

How to add values of same names in a row in an HTML Table

arrays

for-loop

twig