如何使用淘汰赛映射?

时间:2012-07-28 08:16:53

标签: mvvm mapping knockout.js

我已将绑定应用于以下视图模型

var groupDeleteViewModel = {
        group: { Id: ko.observable(), Name: ko.observable(), Members: ko.observableArray() },
        load: function (item) {
            debugger

        },
        remove: function (item) {
            groupDeleteViewModel.group.Id(item.Id());
            groupDeleteViewModel.group.Name(item.Name());
            groupDeleteViewModel.group.Members(item.Members());
            $("#groupDelete").show();
        },
        cancel: function () {
            $("#groupDelete").hide();
        }
    }

remove函数使用 item 中传递给remove函数的数据加载视图。

<div id="groupDelete" class="pop-window filter-view">
    <h2>
        Delete Group
    </h2>
    <table>
        <tr>
            <th>
                Name
            </th>
            <td>
                <span data-bind="text:group.Name" />
            </td>
        </tr>
        <!--ko foreach: group.Members-->
        <tr>
            <th>
            </th>
            <td>
                <div data-bind="text:Name" class="grey-border">
                </div>
            </td>
            <td>
            </td>
        </tr>
        <!--/ko-->
    </table>
    <span class="centeralign">
        <input type="button" value="Delete" data-bind="click: remove" class="delete" />
        <input type="button" value="Cancel" data-bind="click: cancel" />
    </span>
</div>

我不想继续将 item 的每个元素映射到 groupDeleteViewmodel.group 的每个元素。我已经在很多其他地方也在代码中完成了它,这使代码变得非常混乱。我想使用ko.mapping插件来做同样的事情。

直到现在我所尝试的是 -

remove:function (item){
            var data = ko.mapping.toJS(item);
            ko.mapping.fromJS(data, groupDeleteViewModel.group);
            $("#groupDelete").show();
}

但这不起作用。我真的不知道为什么。它应该有理想的工作。 有人能说出在这种情况下使用ko.mapping的正确方法是什么?

感谢。

1 个答案:

答案 0 :(得分:1)

映射插件正在查找groupDeleteViewModel.group中已存在的映射数据,但它找不到它,因为您没有使用映射插件初始化groupDeleteViewModel.group。 所以不要像你那样初始化组:

group: { Id: ko.observable(), Name: ko.observable(), Members: ko.observableArray() }

使用映射插件初始化它:

group: ko.mapping.fromJS({ Id: undefined, Name: undefined, Members: [] })

这是我摆弄你的代码:fiddle