无法将JSON对象映射到ViewModel(淘汰赛js) [英] Can't map JSON object to ViewModel (knockout js)

问题描述

我正在从WCF服务接收json数据，并希望将其映射到我的viewModel.

I'm receiving json data from WCF service and want to map it to my viewModel.

JSON数据:

JSON DATA:

  {"bios" :
        { "Caption" : "something",
          "Version": "something else",
           ....
        }
    }

我的 HTML 部分如下:

<ul class="biosContentUL">
              <li class="biosContentLI">
                  <p>
                     <b>Caption: </b><span data-bind="text: bios.Caption"></span>
                  </p>
                </li>

               <li class="biosContentLI">
                    <p>
                     <b>Version: </b><span data-bind="text: bios.Version"></span>
                    </p>
                </li>
               .......
</ul>

我的 ViewModel 如下:

var viewModel = {
    bios: ko.observable(),
    cpu: ko.observable(),
    .....
}

$(document).ready(function () {
    ko.applyBindings(viewModel);
}
);

我正在尝试使用映射插件，但无法使其正常工作.

I'm trying to use mapping plugin, but can't make it work correctly.

function showBios() {
var response = $.ajax({
        type: "GET",
        datatype: "json",
        url: "...",
        success: function (data) {
            objJS= jQuery.parseJSON(data);
            viewModel.bios(ko.mapping.fromJS(objJS));

             // I also tried this:
            //  ko.mapping.fromJS(objJS, {}, viewModel);
        }
      });

以下代码有效，但我的ViewModel中也有observableArrays，因此如果再调用一次applyBindings()，则会释放其内容.

The following code works, but I also have observableArrays in my ViewModel, so I loose their content if I call applyBindings() one more time.

viewModel.bios = ko.mapping.fromJS(objJS);
ko.applyBindings(viewModel);

如何将接收到的数据映射到我的viewModel属性"bios"?在页面的每个部分都具有多个视图模型是一种好方法，因此在每个模型中我都可以声明简单的属性，而不是复杂的对象?

How can I map received data to my viewModel property "bios" ? Is it a good approach to have multiple viewmodels for each part of the page, so in each model I can declare simple properties, not complex objects?

推荐答案

我通常只喜欢在加载页面时调用一次applybindings，但这确实意味着您需要在页面加载时创建要绑定到的所有可观察对象. .您可以为bios创建一个子视图模型，同时也要绑定可观察对象，然后始终使用update fromJSON方法填充它.

I generally only like calling applybindings once on loading the page, but that does mean that you need to have all the observables you want to bind to created on page load. You could create a child view model for bios, with the observables you want to bind too, and then always use the update fromJSON method to populate it.

您尝试过吗:

function biosViewModel()
{
    var self = this;
    self.Caption = ko.observable();
    self.Version = ko.observable();
}

var viewModel =
{
    bios: ko.observable(new biosViewModel()),
    cpu: ko.observable()
}

然后，以您的成功方法:

Then, in your success method:

ko.mapping.fromJSON(data, viewModel.bios());

使用从服务器获取的数据更新对象.

to update the object with the data you get back from the server.

这篇关于无法将JSON对象映射到ViewModel(淘汰赛js)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！