Javascript 敲除生成一个包含15项的数组，每个部分包含3个部分和5篇文章

您好，我遇到了敲除的情况，我需要迭代数组并生成如下标记：

<section data-bind="foreach: category().questions">
        <article>
            <!-- ko if: hasGrade-->
                <header data-bind="text: description"></header>
                <ul>
                    <li><a href="#">1</a></li>
                    <li><a href="#">2</a></li>
                    <li><a href="#">3</a></li>
                    <li><a href="#">4</a></li>
                    <li><a href="#">5</a></li>
                    <li><a href="#">6</a></li>
                    <li><a href="#">7</a></li>
                    <li><a href="#">8</a></li>
                    <li><a href="#">9</a></li>
                    <li><a href="#">10</a></li>
                </ul>
            <!-- /ko -->
            <!-- ko if: hasMemo-->
                <header data-bind="text: memoTitle"></header>
                <textarea>safa</textarea>
            <!-- /ko -->
        </article>
 </section>

请考虑到我不被允许修改这个可观察对象的结构

第二次编辑

    <div data-bind="foreach: category().questions">
     <!-- ko if: ($index % 5) === 0 -->
    <section >
     <!-- /ko -->   
        <article>
            <!-- ko if: hasGrade-->
            <header data-bind="text: description"></header>
            <ul>
                <li><a href="#">1</a></li>
                <li><a href="#">2</a></li>
                <li><a href="#">3</a></li>
                <li><a href="#">4</a></li>
                <li><a href="#">5</a></li>
                <li><a href="#">6</a></li>
                <li><a href="#">7</a></li>
                <li><a href="#">8</a></li>
                <li><a href="#">9</a></li>
                <li><a href="#">10</a></li>
            </ul>
            <!-- /ko -->
            <!-- ko if: hasMemo-->
            <header data-bind="text: memoTitle"></header>
            <textarea></textarea>
            <!-- /ko -->
        </article>
    <!-- ko if: ($index % 5) === 0 -->
    </section>
    <!-- /ko -->   
</div>

我尝试添加此表达式：但由于某些原因，它不再显示任何内容。如果我删除它，我会获得数据，但它不会显示。我想要它吗？我是否编写此表达式不正确

<!-- ko if: ($index % 5) === 0 -->

---

如果我理解正确，您可以这样做：

<div data-bind="foreach: categories">
    <section><span data-bind="text: title"></span>

        <br/>
        <!-- ko foreach : questions -->
        <article>

            <!-- ko if: hasGrade-->
                <header data-bind="text: description"></header>
                <ul>
                    <li><a href="#">1</a></li>
                    <li><a href="#">2</a></li>
                    <li><a href="#">3</a></li>
                    <li><a href="#">4</a></li>
                    <li><a href="#">5</a></li>
                    <li><a href="#">6</a></li>
                    <li><a href="#">7</a></li>
                    <li><a href="#">8</a></li>
                    <li><a href="#">9</a></li>
                    <li><a href="#">10</a></li>
                </ul>
            <!-- /ko -->
            <!-- ko if: hasMemo-->
                <header data-bind="text: memoTitle"></header>
                <textarea>safa</textarea>
            <!-- /ko -->

        </article>
        <!-- /ko -->
    </section>
</div>

萨法

---

我希望它能有所帮助。

使用

$index（）

变量可以实现这些功能。 见：

使用提供的模型：

---

不确定它是否与您想要的匹配，但可能会给出下一步的方向。

在这种情况下，您不能使用

if

和

index（）

，因为它必须是

if

块中的有效HTML标记，并且打开和关闭

部分本身无效

您需要的是一个计算属性，用于对问题进行分组：

self.groupedQuestions = ko.computed(function(){
    var groups = [];
    var index = 0;
    var group;
    ko.utils.arrayForEach(self.category().questions, function(item){
        if (index % 5 ===0)
        {
            group = [];
            groups.push(group);
        }
        group.push(item);
        index++;
    });
    return groups;
});

然后在视图中需要两个
foreach
绑定：一个用于组，另一个用于组内的问题：

<div data-bind="foreach: groupedQuestions">
    <section>
        <!-- ko foreach: $data -->
            <article>
                <!-- ... -->
            </article>
        <!-- /ko -->
    </section>
</div>


你能发布你需要绑定的数据结构吗？我刚刚发布了一个关于我拥有的模型的更新，我不允许修改它。你应该考虑到每个部分应该有5篇文章，其中有问题。在这种情况下，我将只在一个部分中获取所有问题。你将迭代问题，而不是类别
self.groupedQuestions = ko.computed(function(){
    var groups = [];
    var index = 0;
    var group;
    ko.utils.arrayForEach(self.category().questions, function(item){
        if (index % 5 ===0)
        {
            group = [];
            groups.push(group);
        }
        group.push(item);
        index++;
    });
    return groups;
});

<div data-bind="foreach: groupedQuestions">
    <section>
        <!-- ko foreach: $data -->
            <article>
                <!-- ... -->
            </article>
        <!-- /ko -->
    </section>
</div>