4

ノックアウト仮想要素を使用して、2 つのレコードごとに新しい行を作成しようとしています。私の問題は、2 つの偶数インデックスの間に奇数レコードが生成されないことです。

ここに私のソースHTMLがあります

   <!--ko foreach:UDGroupboxes-->
    <!--ko if:$index()%2==0 || $index()==0-->
    <div class="row-fluid">
    <!--/ko-->
        <div class="panel form-horizontal span6">
            <div class="panel-heading"><span data-bind="text:$data.Caption"></span></div>
        </div>
     <!--ko if:$index%2()!=0 && $index()!=0-->
    </div>
    <!--/ko-->
    <!--/ko-->

出力 HTML

<div data-bind="attr:{id:Name}" class="tab-pane active" id="Tabsheet1">
    <!--ko foreach:UDGroupboxes-->
    <!--ko if:$index()%2==0 || $index()==0-->
    <div class="row-fluid">
    <!--/ko-->
        <div class="panel form-horizontal span6">
            <div class="panel-heading"><span data-bind="text:$data.Caption"></span></div>
        </div>
     <!--ko if:$index%2()!=0&&$index()!=0-->
    </div>
    <!--/ko-->

    <!--ko if:$index()%2==0 || $index()==0--><!--/ko-->

    <!--ko if:$index()%2==0 || $index()==0-->
    <div class="row-fluid">
    <!--/ko-->
        <div class="panel form-horizontal span6">
            <div class="panel-heading"><span data-bind="text:$data.Caption"></span></div>
        </div>
     <!--ko if:$index()%2!=0&&$index()!=0-->
    </div>
    <!--/ko-->
    <!--/ko-->
</div>

パネルは条件に関係なく生成する必要があります。この条件は、偶数で新しい行を開き、オッズで行を閉じることのみを決定します。

4

2 に答える 2

8

ノックアウト バインディングは要素でのみ発生し、仮想要素も要素階層に準拠する必要があります。あなたの例を取り上げ、インデントを使用して要素の関係を示すと、次のようになります。

<!--ko foreach:UDGroupboxes-->
    <!--ko if:$index()%2==0-->
        <div class="row-fluid">
            <!--/ko-->
            <div class="panel form-horizontal span6">
                <div class="panel-heading"><span data-bind="text:$data.Caption"></span></div>
            </div>
            <!--ko if:$index()%2!=0-->
        </div>
    <!--/ko-->
<!--/ko-->

内の終了仮想タグと開始仮想タグはdiv、Knockout によって無視されます。したがって、上記は1つおきのアイテムを出力する効果があります。

ノックアウトで配列項目のグループ化を行うための良い答えは次のとおりです: https://stackoverflow.com/a/10577599/1287183

于 2013-08-09T23:25:44.690 に答える