0

我正在尝试使用淘汰映射插件，但它没有将数据绑定到我的 UI。以下是我的代码：

var model;

$(document).ready(function () {
$.ajax({
    type: "POST",
    url: SERVER_PATH + '/jqueryservice/DataAccessService.asmx/GetData',
    async: false,
    data: "{ }",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function (result, status) {
        model = ko.mapping.fromJS(result.d);
    },
    error: GetDataError

});

 });

 function GetDataError() {
     alert("System is not responding at the moment. Please try again.");
 }

谁能让我知道我在这里做错了什么？以下是从服务器返回的数据：

{"ID":903,"Name":"Camela Holding","Email":"Camelah@yahoo.com",
   "Vehicles":[{"ID":1,"Name":"Van"},
               {"ID":2,"Name":"Car"},
               {"ID":4,"Name":"Cadillac"},
               {"ID":5,"Name":"Train"},                         {"ID":3,"Name":"Jeep"}],
   "OwnerVehicle":0,"WeeklyData":null,"Week1":null}
4

2 回答 2

0

我能够在类似的情况下使这个修复工作，但我不知道它为什么以及如何工作的确切原因。

我试图使用敲除映射插件将可观察对象与作为数组的 AJAX 响应绑定。

这就是我最初正在做的事情：

   self.DataRows = ko.observableArray();
   $.ajax({
                url: '/Home/GetStudentList1',
                cache: false,
                type: 'post',
                data: self.GridParams,
                success: function (data) {                        
                    self.DataRows(ko.mapping.fromJS(data));
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    console.log("error :" + XMLHttpRequest.responseText);
                    alert('There was an error in performing this operation.');
                }
            });

数据被映射到 observable 但 UI 没有更新然后我尝试了这个

   $.ajax({
                url: '/Home/GetStudentList1',
                cache: false,
                type: 'post',
                data: self.GridParams,
                success: function (data) {
                    var observableData = ko.mapping.fromJS(data);
                    self.DataRows(observableData());
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    console.log("error :" + XMLHttpRequest.responseText);
                    alert('There was an error in performing this operation.');
                }
            });

唯一的区别是我在将它与我的 observable 映射之前将它放入一个变量中。
同样，在您的情况下，我认为您应该尝试以下操作：

var self = this; //save reference to this as you will it in ajax success
self.model = ko.observable(); //create your observable
 $.ajax({
            type: "POST",
            url: SERVER_PATH + '/jqueryservice/DataAccessService.asmx/GetData',
            async: false,
            data: "{ }",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
        success: function (result, status) {
                 var data = ko.mapping.fromJS(result.d);// don't have any idea what is making knockout happy doing it this way?
                 self.model(data());
    },
        error: GetDataError

    });

在这两种情况下，当我执行 console.log(DataRows()) 时，observable 的结构都是相同的。

于 2015-06-18T10:38:34.730 回答
0

好吧，这是我们问题的答案-

尝试这个

var model  = ko.observable();
$(document).ready(function () {
$.ajax({
      type: "POST",
      url: SERVER_PATH + '/jqueryservice/DataAccessService.asmx/GetData',
      async: false,
      data: "{ }",
      contentType: "application/json; charset=utf-8",
      dataType: "json",
success: function (result, status) {
    model(ko.mapping.fromJS(result.d)()); //mapped using braces ()
},
error: GetDataError

   });

 });

请注意，这里唯一的区别是我使您的模型可观察，而不是 model = ko.mapping.fromJS(result.d)); 我使用了 model(ko.mapping.fromJS(result.d)());

现在我不是将我的 JSON 对象映射到数组中，而是将我的 observable 映射。因为你必须知道所有 observable 都变成了函数，并且它们的值是使用这些大括号“（）”之类的函数来访问的。

只是因为这个原因，当我将它放入一个单独的变量然后使用大括号访问它时它才起作用。

于 2015-06-25T12:21:11.943 回答