AiNoTame

Dio è nella pioggia.
posts - 17, comments - 79, trackbacks - 0

Knockout containerless binding

In ambito XAML per mostrare una lista di elementi occorre impostare il datacontext di un ItemsControl ad una IEnumerable. L’ItemsControl poi rendererizza la lista in base al DataTemplate specificato nella proprietà ItemTemplate. Per aggiungere oggetti nuovi ho sempre usato ItemTemplateSelector e/o CompositeCollection, ma la presenza di un container l’ho sempre considerata obbligatoria (correggetemi se sbaglio).

Ho considerato l’assioma valido anche in Knockout, ma non è così. Con knockout è possibile scrivere un “contenitore fittizio” tramite commenti:

<!-- ko ... -->
<!-- /ko -->

Tramite questa feature è possibile (come nel mio caso particolare) creare una tabella con un numero di colonne variabili:

<table id="classificationTable">
<thead>
<tr>
<td>Rank</td>
<td>Country</td>
<td>Full Name</td>
<!-- ko foreach: batteries -->
<td>R<span data-bind="text: $data"></span></td>
<!-- /ko -->
<td>TOT</td>
</tr>
</thead>
<tbody data-bind="foreach: positions">
<tr>
<td data-bind="text: rank"></td>
<td data-bind="text: country"></td>
<td data-bind="text: fullname"></td>
<!-- ko foreach: regularShots -->
<td data-bind="text: $data"></td>
<!-- /ko -->
<td data-bind="text: totalRegularPoints"></td>
</tr>
</tbody>
</table>

Comodo, utile, veloce.

Ps: gli elementi <td> chiudeteli sempre con un tag </td>, non scriveteli con un tags self-closing <td data-bind="" /> altrimenti KnockoutJs potrebbe dare qualche problemino (e non solo lui)

Print | posted on martedì 7 febbraio 2012 01:09 | Filed Under [ Javascript Knockout ]

Comments have been closed on this topic.

Powered by:
Powered By Subtext Powered By ASP.NET