我是淘汰赛的新手,我正在创建一个想要获得淘汰赛优势的jquery移动应用程序。我已经花了最后一天抨击我的头撞到一个非常简单的问题..我已经删除了代码并手动绑定(因此几乎击败了使用KO而不是jquery的目的)..无论如何,如果有人可以告诉我如何改变我必须使用KO的真正力量,那么对我来说这将是一个很好的基础。我能找到的任何代码示例总是存在比这更复杂的问题(处理数组等)。
我的JSON:
{"id":9,"fullName":"John Doe","firstName":"John","lastName":"Doe","referenceNumber":"BUY-08","position":"Buyer","type":"Buyer","telephone":"028 82 240780","email":"m@email.com","departmentId":3,"departmentName":"DEPT B","country":"United Kingdom"}
我的HTML:
<div>
Full Name: <input data-bind="value: fullName" disabled="disabled"/> <br />
Ref: <input data-bind="value: reference" disabled="disabled"/> <br />
Position: <input data-bind="value: position" disabled="disabled"/> <br />
Email: <input data-bind="value: email" disabled="disabled"/> <br />
Dept: <input data-bind="value: departmentName" disabled="disabled"/> <br />
Country: <input data-bind="value: country" disabled="disabled"/> <br />
</div>
我的Javascript:
$(document).ready(function () {
function DetailsViewModel() {
var self = this;
self.fullName = ko.observable("");
self.reference = ko.observable("");
self.email = ko.observable("");
self.position = ko.observable("");
self.departmentName = ko.observable("");
self.country = ko.observable("");
var success = function (data) {
self.fullName(data.fullName);
self.reference(data.referenceNumber);
self.email(data.email);
self.position(data.position);
self.departmentName(data.departmentName);
self.country(data.country);
$.mobile.loading('hide');
};
webAPICall("api/user/getcurrentuser",
"GET", success); // simple wrapper I'm using for ajax calls
}
ko.applyBindings(new DetailsViewModel());
});
非常感谢任何帮助,谢谢!
答案 0 :(得分:5)
如果您不需要任何其他函数或为视图模型计算,则使用映射插件非常简单。您应该将JSON传递给ko.mapping.fromJS:
var viewModel = {};
function success(data) {
viewModel = ko.mapping.fromJS(data);
ko.applyBindings(viewModel);
}
webAPICall("api/user/getcurrentuser", "GET", success);
如果数据是JS对象,则使用fromJS
函数;如果是JSON字符串,则使用fromJSON
。并确保您在data-bind
属性和json
中拥有相同的属性名称。