淘汰js模板将json数据源传递给模板

时间:2014-07-10 16:10:46

标签: javascript jquery knockout.js knockout-mapping-plugin x-editable

我是Knockout及其模板功能的新手,我有以下html,有人可以帮我构建一个合适的模板来替换它的字符串文字和数据源,我使用的是x-editable,#

<tr data-bind="foreach: fundClasses">
    <td class="span1">
        <span data-bind="visible: $index() == 0">  Rate Index</span>
    </td>
    <td class="span1 protected">
        <span data-bind=" editable:INDEX_ID,  editableOptions: {name:'INDEX_ID',mode: 'popup',type: 'select', source: rateIndex,pk: ID, url: '/create/EditInPlace'}"></span>
    </td>
</tr>

我想在上面的片段中替换rateIndex,INDEX_ID,非常感谢任何帮助。

由于 乔治

1 个答案:

答案 0 :(得分:0)

我自己想出来了,所以想回答这样可以帮助其他人寻找类似的问题,

模板:

<script id="textBoxTemplate" type=“text/html”>
   <!-- ko foreach: $data -->
    <td class="span1">
        <span data-bind="visible: $index() == 0,text:title">  </span>
    </td>
    <td class="span1 protected">
         <span data-bind="editable:$data[field],editableOptions: {  mode: 'popup', pk: ID, url: '/create/EditInPlace'}"></span>
   </td>
   <!-- /ko -->

用法:

<tr data-bind="templateWithContext: { name: 'textBoxTemplate', data: fundClasses, context: { title: 'Index', field:'INDEX_ID' }}"></tr>

绑定处理程序:

ko.bindingHandlers.templateWithContext = {
    init: ko.bindingHandlers.template.init,
    update: function (element, valueAccessor, allBindings, data, context) {
        var options = ko.utils.unwrapObservable(valueAccessor());

        ko.utils.extend(context, options.context);

        return ko.bindingHandlers.template.update.apply(this, arguments);
    }
};