SO? Comment: problems with passing $item to nested templates

HTML

<div class="results"></div>
<script id="subItemTemplate" type="text/x-jquery-tmpl">
    <li>${$item.display1($data)}</li>
    <li>${$item.display2($data)}</li>
</script>
<script id="itemTemplate" type="text/x-jquery-tmpl"> 
    <ul>
        <li>${$item.display1($data.x)}</li>
        <li>${$item.display2($data.y)}</li>
        <li>
            <ul>
                {{! FAIL: calls the template once, maintains functions, but overrides the data with $item.data }}
                {{tmpl($data.y, $item) "#subItemTemplate"}}
            </ul>
        </li>
        <li>
            <ul>
                {{! FAIL+1: calls the template once for each item in the array, maintains functions, but overrides the data with $item.data }}
                {{tmpl($data.z, $item) "#subItemTemplate"}}
            </ul>
        </li>
        <li>
            <ul>
                {{! SUCCESS: calls the template once for each item in the array, leaves the data and maintains custom function(s) }}
                {{tmpl($data.z, { display1: $item.display1, display2: $item.display2 }) "#subItemTemplate"}}
            </ul>
        </li>
    </ul>
</script>
<script type='text/javascript' src='http://code.jquery.com/jquery-1.6.2.js'></script>
<script type='text/javascript' src="http://ajax.aspnetcdn.com/ajax/jquery.templates/beta1/jquery.tmpl.min.js"></script>

CSS

li li { margin-left: 5px; }
ul ul { border-bottom: 1px solid #000; }

JavaScript

$(function() {
    var data = {
        x: "meh",
        y: 123,
        z: [ "abc", "123", "def", "456" ]
    };

    $("#itemTemplate").tmpl(data, {
        display1: function(item) {
            return "test1: " + item;
        },
        display2: function(item) {
            return "test2: " + item;
        }
    }).appendTo($(".results"));
});