Question

我遇到了将jSON结果与knockout js绑定的问题。以下是我的代码

var AddDeparmentViewModel = function() {
var self = this;
self.AddDepartmentModel = {};
$.getJSON('/EventTracker/Department/GetEmptyModel/', function(data) {
    ko.mapping.fromJS(data, {}, self.AddDepartmentModel);
});
};

$(document).ready(function() {
var departmentViewModel = new AddDeparmentViewModel();
ko.applyBindings(departmentViewModel);
})

这是我的HTML：

<div class="titleWrapper">
        Add Department
    </div>
    <label>Department Name:</label>
    <input data-bind="value: AddDepartmentModel.DepartmentName" id="departmentNameTextbox" type="text" />
    <p data-bind="text: AddDepartmentModel.DepartmentName"></p>

我返回的值没有出现。有人能指出我的错误在哪里。在这种情况下，服务器返回单个对象而不是对象数组。

谢谢！

编辑：

服务器返回此JSON： {“DepartmentID”：0，“DepartmentName”：“Test”，“EVNTTRKR_Admins”：[]，“EVNTTRKR_Event”：[]，“EVNTTRKR_ItemCategories”：[]}

编辑：

这是函数GetEmptyModel：

 public JsonResult GetEmptyModel()
        {
            var eventT = new EVNTTRKR_Departments();
            eventT.DepartmentName = "Test";
            return Json(eventT, JsonRequestBehavior.AllowGet);
        }

Answer 1

您遇到的问题似乎相当普遍。在绑定viewmodel之后，您正在创建的可观察对象。当发生这种情况时，没有任何东西可以用于连接并且没有任何东西被渲染。解决这个问题的方法是确保AddDepartmentModel是一个可观察的，并将其设置为返回值，而不是用fromJS覆盖它。

var AddDeparmentViewModel = function() { var self = this; self.AddDepartmentModel = ko.observable({}); //important to have a default value so bindings dont break $.getJSON('/echo/json/', function(data){ var mapped = ko.mapping.fromJS(data); self.AddDepartmentModel(data); // here we are pushing values into the observable }); };

这也需要修复绑定，因为他们现在需要调用AddDepartmentModel作为函数：

<input data-bind="value: AddDepartmentModel().DepartmentName" id="departmentNameTextbox" type="text" />

json请求和回调中的填充示例。 http://jsfiddle.net/infiniteloops/YWC9N/

Answer 2

我创建了一个jsfiddle here并用您的服务器数据替换了您的getJson调用（因为我无法调用您的getJson url）。这一切似乎都让我相信在getJson调用中发生错误。

您是否可以打开浏览器开发人员工具并在控制台中查找任何错误。如果出现错误并且您不确定其含义，请将错误信息添加到原始问题说明中。

var AddDeparmentViewModel = function() {
    var self = this;   
    self.AddDepartmentModel = {};
    var data = 
        {"DepartmentID":0,"DepartmentName":"Test","EVNTTRKR_Admins":[],"EVNTTRKR_Event": [],"EVNTTRKR_ItemCategories":[]
        };
    ko.mapping.fromJS(data, {}, self.AddDepartmentModel);
};

$(document).ready(function() {
    var departmentViewModel = new AddDeparmentViewModel();
    ko.applyBindings(departmentViewModel);
})

Knockoutjs绑定JSON

2 个答案: