rilegatura templatura modello

Question

Ho un elemento ul che viene riempito tramite associazione modello.

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

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

Ma io voglio il primo li-tag non sarebbe li-tag dal modello, ma un altro con il tasto in esso e non sarà collegato a someElemets array. Se lo faccio in questo modo

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

quindi il tag li con il pulsante sarà l'ultimo dopo il rendering. Qual è il modo migliore per risolvere questo problema?

Answer 1

È possibile utilizzare la sintassi del flusso di controllo containerless, associazione dati utilizzando tag di commento. Non c'è bisogno di un modello. more info

<ul>  
    <li><button data-bind=click: doSomething">Click me</button></li> 
    <!-- ko foreach: someElemets-->   
    <li> 
     <span data-bind="text: someText"></span> 
    </li>  
    <!-- /ko --> 
</ul> 

Answer 2

Non sono a conoscenza di un modo semplice per accedere all'indice quando si è all'interno di un modello. È possibile utilizzare le opzioni modello, come descritto in How to use foreach with a special first element?

Il tuo codice sarebbe qualcosa di simile:

<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> 

Answer 3

Di seguito lo farà:

<!-- ko template: { name: 'template-name', data: vm } --> <!-- /ko -->