0

foreach ループ内で作成された余分な div が余分な空白の高さをブラウザーに表示しないようにするための、knockout.js や CSS のベスト プラクティスはありますか?

ソース：

<div data-bind="foreach: jobs" >
  <div data-bind="if: JobPhase.Id() == 3">
    <div data-bind="text: JobPhase.Id"></div>                            
  </div>
</div>

結果：

<div data-bind="if: JobPhase.Id() == 3"></div>
<div data-bind="if: JobPhase.Id() == 3"></div>
<div data-bind="if: JobPhase.Id() == 3"></div>
<div data-bind="if: JobPhase.Id() == 3">
  //This one matched so it will display the content.
</div>

最初の 3 つの項目は一致しませんでしたが、まだ空白が表示されています。考え？

4

1 に答える 1

3

ソリューションでは、div がレンダリングされ、空にレンダリングされますが、これはあまり良い方法ではありません。別の「if」ステートメントを使用する必要があります。例のように。

<div data-bind="foreach: jobs" >  
  <!-- ko if: Id == 3 -->  
    <div data-bind="text: Id"></div>                         
  <!-- /ko-->
</div>

したがって、常に作成するのではなく、必要な場合にのみ div ブロックを作成できます。

于 2012-05-19T12:26:22.320 に答える