knockout.js - Trouble using 'with' binding with a named template

Question

I'm new to knockout. I have a viewmodel with a list of trades. I'm showing a couple of fields from them in a on the left of my page. When the user hovers over one of them, i want to show details of the tade on the right of the page. My viewmodel looks like this

 var self = this;
    self.selectedTrade = ko.observable(null);
    self.trades = ko.observableArray();
    self.selectTrade = function (item) {
        self.selectedTrade(item);
    }

When a user hovers over an item in the left, it calls selecttrade so the selectedTrade has a vaulue. I have a div on the right bound to selectedTrade.

<ul data-bind="template: {name: 'tradelist', foreach: trades}" />
<script id='tradelist' type="text/html">
 <li> <span data-bind="text: Cname, event: { mouseover: $root.selectTrade } "/>&nbsp <span data-bind="text: Cparty"/></li>
</script>
</div>
<div data-bind="template: {with: selectedTrade(), name: 'displayTradeTemplate' }" />

<script id='displayTradeTemplate' type="text/html">

  <table>
            <tr>
                <td>
                    Contract Name:
                </td>
                <td>
                    <span data-bind="text: Cname">
                    </span>
                </td>
            </tr>
</table>

When i load the page javascript compains: Microsoft JScript runtime error: Unable to parse bindings. Message: SyntaxError: Expected identifier, string or number; Bindings value: template: {with: selectedTrade(), name: 'displayTradeTemplate' }

anyone know whats wrong with that binding.

Answer 1

そのテンプレートバインディング内data:の代わりに使用with: