KnockoutJS Template padding

http://groups.google.com/group/knockoutjs/browse_thread/thread/226e10f4f300472b/d6b20adecadefa4a?lnk=gst&q=templateOptions#d6b20adecadefa4a

by magikMaker

HTML

<script src="https://github.com/jquery/jquery-tmpl/raw/master/jquery.tmpl.js"></script>
<script src="https://github.com/SteveSanderson/knockout/raw/master/build/output/knockout-latest.debug.js"></script>
<span data-bind="text:'ident:'+ident()"></span>
<ul data-bind="template:{
  templateOptions:{pad:ident},
  name:'itemTemp', 
  foreach:items
}">
</ul>

<script id="itemTemp" type="text/html">
  <li>
      ${$item} -- ${$data.name} -- 
    <span data-bind="style:{ padding:$item.pad()+'em'},text: name"></span>
  </li>
</script>-
<button id="btnIncrease" onclick="return increasePadding()">Increase padding</button>

JavaScript

var viewModel = {
        ident: ko.observable(3),
        items: [{ name: "item 1" }, { name: "item 2"}]
    };

    ko.applyBindings(viewModel);
    function increasePadding() {
        var p = viewModel.ident();
        p += 2; 
        viewModel.ident(p);
    }