将列表的输出排序为不同的<ul>标签Django模板

Question

我的一个模板中有以下代码。如你所见，有很多重复。因此，我想知道我是否可以某种方式使用Django模板来整合这些代码，同时在HTML方面实现相同（或非常可比）的结果。也就是说，我感兴趣的是，如果我可以将todo条目排序到页面上的两个不同的<ul>标签中，具体取决于todo.todo_completed的布尔值。

{% block content %}
{% if todo_list %}
    <ul class="list-group">
    {% for todo in todo_list %}
        {% if not todo.todo_completed %}
        <li class="list-group-item">
            <div class="row">
                <div class="col-sm-5">
                        <a href="{% url 'list:todo-detail' todo.id %}" >{{ todo.todo_name }}</a>
                </div>
                <div class="col-sm-6">

                </div>

                <div class="col-sm-1">
                    <a href="{% url 'list:todo-complete' todo.id %}">{% bootstrap_icon "ok" %}</a>

                    <a href="{% url 'list:todo-delete' todo.id  %}">{% bootstrap_icon "remove-circle" %}</a>

                </div>
            </div>
        </li>
        {% endif %}

    {% endfor %}
    </ul>

    <ul class="list-group">
    {% for todo in todo_list %}
        {% if todo.todo_completed %}
        <li class="list-group-item">
            <div class="row">
                <div class="col-sm-5">
                        <a href="{% url 'list:todo-detail' todo.id %}" class="text-muted">{{ todo.todo_name }}</a>
                </div>
                <div class="col-sm-6">

                </div>

                <div class="col-sm-1">
                    <a href="{% url 'list:todo-complete' todo.id %}">{% bootstrap_icon "ok" %}</a>

                    <a href="{% url 'list:todo-delete' todo.id  %}">{% bootstrap_icon "remove-circle" %}</a>

                </div>
            </div>
        </li>
        {% endif %}
    {% endfor %}
    </ul>