仅在最后一个索引处检查foreach中的if条件

Checking an if condition in a foreach only at the last index

本文关键字:foreach 中的 if 条件 检查 最后一个 索引      更新时间:2023-09-26

Hi我有一种情况,我有一个可观察数组的可观察数组。这就是我的标记:

<div class="slider-wrap cycle-slideshow" data-cycle-fx="scrollHorz" data-cycle-timeout="0" data-cycle-slides="> section" data-cycle-prev=".slider-nav .prev" data-cycle-next=".slider-nav .next" data-cycle-pager=".slider-bullets" data-bind="foreach: category().questions()">
    <section data-bind="foreach: $data">   
        <article>
            <!-- ko if: hasGrade-->
            <header data-bind="text: $data.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>
            <span data-bind="text: $parent.$index"></span>
            <!-- /ko -->
            <!-- ko if: hasMemo-->
            <header data-bind="text: $data.memoTitle"></header>
            <textarea></textarea>
            <!-- /ko -->
        </article>
        <!-- /ko -->
        <!-- ko if: $parent.$parent.hasMemo-->
        <article>
            <header data-bind="text: $parent.$parent.memoTitle"></header>
            <textarea></textarea>
        </article>
        <!-- /ko -->
    </section>
</div>

我不能改变标记的结构,因为我正在使用一个插件,并且没有不使用它的奢侈。

只有在迭代最后一个元素时,才应检查最后一个if条件。这就是型号:

   {
memo: null,
categoryId: 1,
title: "Docent",
hasMemo: true,
memoIsMandatory: false,
memoTitle: "Docent Opmerkingen",
questions: [
[
{
memo: null,
grade: null,
description: "De docent is goed voorbereid",
memoTitle: "De docent is goed voorbereid",
questionId: 11,
hasGrade: false,
hasMemo: true,
showOnlyMemo: true
},
{
memo: null,
grade: null,
description: "De docent heeft kennis van zaken",
memoTitle: "De docent heeft kennis van zaken",
questionId: 12,
hasGrade: true,
hasMemo: false,
showOnlyMemo: false
},
{
memo: null,
grade: null,
description: "De docent kan de onderwerpen boeiend uitleggen",
memoTitle: "De docent kan de onderwerpen boeiend uitleggen",
questionId: 13,
hasGrade: true,
hasMemo: false,
showOnlyMemo: false
},
{
memo: null,
grade: null,
description: "De docent gaat goed in op de vragen uit de groep",
memoTitle: "De docent gaat goed in op de vragen uit de groep",
questionId: 14,
hasGrade: true,
hasMemo: false,
showOnlyMemo: false
},
{
memo: null,
grade: null,
description: "De docent stimuleert de groep tot actieve deelname",
memoTitle: "De docent stimuleert de groep tot actieve deelname",
questionId: 15,
hasGrade: true,
hasMemo: false,
showOnlyMemo: false
}
],
[
{
memo: null,
grade: null,
description: "De docent voegt inhoudelijk iets toe aan het studiemateriaal",
memoTitle: "De docent voegt inhoudelijk iets toe aan het studiemateriaal",
questionId: 16,
hasGrade: true,
hasMemo: false,
showOnlyMemo: false
},
{
memo: null,
grade: null,
description: "De docent is praktijkgericht",
memoTitle: "De docent is praktijkgericht",
questionId: 17,
hasGrade: true,
hasMemo: false,
showOnlyMemo: false
},
{
memo: null,
grade: null,
description: "Totaal oordeel over de docent",
memoTitle: "Totaal oordeel over de docent",
questionId: 18,
hasGrade: true,
hasMemo: false,
showOnlyMemo: false
}
]
]
},
{
memo: null,
categoryId: 7,
title: "Opbouw programma en studiemateriaal",
hasMemo: true,
memoIsMandatory: false,
memoTitle: "Opbouw programma en studiemateriaal Opmerkingen",
questions: [
[
{
memo: null,
grade: null,
description: "Het studieprogramma is duidelijk opgebouwd",
memoTitle: "Het studieprogramma is duidelijk opgebouwd",
questionId: 54,
hasGrade: true,
hasMemo: false,
showOnlyMemo: false
},
{
memo: null,
grade: null,
description: "Het studiemateriaal is compleet, goed leesbaar en praktijkgericht",
memoTitle: "Het studiemateriaal is compleet, goed leesbaar en praktijkgericht",
questionId: 55,
hasGrade: true,
hasMemo: false,
showOnlyMemo: false
}
]
]
}
]

在我们的案例中,这是问题ID为55的元素。有什么方法可以实现这一点吗?

foreach绑定中,您可以使用特殊的$index变量来引用您在循环中的位置。那么检查就很简单了。

<!-- ko if: $parent.$parent.hasMemo() && $index() + 1 === $parent.length -->
<article>
    <header data-bind="text: $parent.$parent.memoTitle"></header>
    <textarea></textarea>
</article>
<!-- /ko -->

请注意,当您在绑定中使用复杂的JS表达式(而不是单个可观察对象或变量的名称)时,您需要显式打开可观察对象。因此,$index()$parent.$parent.hasMemo()中的括号。