5

テンプレート バインディングによって埋められる ul 要素があります。

<script type="text/html" id="someTemplate">
<li>
   <span data-bind="text: someText">
</li>
</script>

<ul data-bind="template: {foreach: someElemets, name: 'someTemplate'}">
</ul>

しかし、最初のli-tagはテンプレートからのli-tagではなく、ボタンを含む別のli-tagであり、someElemets配列には接続されません。私がそのようにしたら

<ul data-bind="template: {foreach: someElemets, name: 'someTemplate'}">
    <li><button data-bind=click: doSomething">Click me</button></li>
</ul>

ボタン付きのli-tagは、レンダリング後の最後のものになります。その問題を解決する最善の方法は何ですか?

4

3 に答える 3

12

コンテナーレス制御フロー構文、コメント タグを使用したデータ バインディングを使用できます。テンプレートは必要ありません。より詳しい情報

<ul>     
    <li><button data-bind=click: doSomething">Click me</button></li>
    <!-- ko foreach: someElemets-->         
    <li>
        <span data-bind="text: someText"></span>
    </li>    
    <!-- /ko -->
</ul>
于 2012-02-14T12:44:41.320 に答える
7

次のようにします。

<!-- ko template: { name: 'template-name', data: vm } --> <!-- /ko -->
于 2014-05-29T04:05:53.413 に答える
1

テンプレート内でインデックスにアクセスする簡単な方法を知りません。特別な最初の要素で foreach を使用する方法で説明されているように、テンプレート オプションを使用できます。

コードは次のようになります。

<ul data-bind="template: { name: 'someTemplate', foreach: someElemets, templateOptions: { first: someElemets()[0]} }">
</ul>

<script id="someTemplate" type="text/html">
    <li>
    {{if $item.first === $data}}
      <button data-bind="click: doSomething">Click me</button>
    {{/if}}
    <span data-bind="text: someText">
    </li>
</script>
于 2012-02-14T12:36:41.847 に答える