如何将ko.mapping.fromJS数组中的项复制到视图模型的另一个属性

How do I copy an item from a ko.mapping.fromJS Array to another property of the viewmodel?

本文关键字:复制 模型 属性 另一个 视图 ko mapping 数组 fromJS      更新时间:2023-09-26

这里有一些曾经在Knockout 2上运行的现有代码中工作的东西,我正在重构到Knockout 3。

视图模型的属性从提要(简化代码)初始化:

$.ajax({
    url: "/api/GetData",
    data: {
        clientId: clientId
    },
    type: "GET",
    dataType: "json",
    contentType: 'application/json; charset=utf-8',
    traditional: true,
    success: function (data) {
        viewModel.periods(ko.mapping.fromJS(data)());
        viewModel.selectedPeriod = ko.observable(viewModel.periods()[0]);
    },
    async: false
});

调试值时,viewModel.selectedPeriod =行有效,但绑定不起作用。

所以这失败了。。。

<ul data-bind="foreach: selectedPeriod.Years">
    <li data-bind="text: Year"></li>
</ul>

而这是有效的:

<ul data-bind="foreach: periods">
    <li>
        <ul data-bind="foreach: Years">
            <li data-bind="text: Year"></li>
         </ul>
    </li>
</ul>

我在一个简化的Fiddle中重现了我的问题:https://jsfiddle.net/frankvaneykelen/w3opn442/12/

只需对代码进行一些更改。。。

viewModel.selectedPeriod(viewModel.periods()[0]); // observable method call instead of assigning

 <ul data-bind="foreach: selectedPeriod().Years">  // resolve the observable first ... 

工作代码可以在这里找到

https://jsfiddle.net/0cLtvqz0/4/

您需要使用with绑定来适当缩小上下文范围:

https://jsfiddle.net/lobotomize/w3opn442/13/

注意外部div 上的with绑定

    <div class="col-xs-6" data-bind="with: selectedPeriod">
         <h5>selectedPeriod.Years</h5>
        <ul data-bind="foreach: Years">
            <li data-bind="text: Year"></li>
        </ul>
    </div>