在knockoutjs“未捕获的错误:无法解析绑定。”错误,但代码工程
问题描述:
我正在与基因敲除js映射,而尝试执行示例我得到控制台错误。在knockoutjs“未捕获的错误:无法解析绑定。”错误,但代码工程
Uncaught Error: Unable to parse bindings. Message: ReferenceError: loadUserData is not defined; Bindings value: click: loadUserData
这里的代码,
<form action="#" method="post">
<p>First name: <input data-bind='value: firstName' /></p>
<p>Last name: <input data-bind='value: lastName' /></p>
<div>
Your favorite food:
<select data-bind='options: activities, value: favoriteHobby'></select>
</div>
<p><button data-bind='click: loadUserData'>Load data</button></p>
<p><button data-bind='click: saveUserData'>Save Data</button></p>
</form>
<script>
function PersonViewModel() {
var self = this;
self.firstName = "";
self.lastName = "";
self.activities = [];
self.favoriteHobby = "";
self.loadUserData = function() {
$.getJSON("/get-user-data.json", function (data) {
var viewModel = ko.mapping.fromJS(data);
ko.applyBindings(viewModel);
});
}
self.saveUserData = function() {
var data_to_send = { userData: ko.toJSON(self) };
$.post("/save-user-data", data_to_send, function (data) {
alert("Your data has been posted to the server!");
}).fail(function() {
alert("Ensure the Url before save the data");
});
}
}
ko.applyBindings(new PersonViewModel());
</script>
GET-用户data.json
{
"firstName": "John",
"lastName": "Smith",
"activities": [ "Golf", "Kayaking", "Web Development" ],
"favoriteHobby": "Golf"
}
而点击负载数据按钮错误的现象发生,但样品的工作原理,清除这个错误。
答
正如@ user3297291指出的那样,您不能两次调用ko.applyBindings。相反,使视角模型淘汰赛的属性和淘汰赛将自动更新你的用户界面时,他们改变:
function PersonViewModel() {
var self = this;
self.firstName = ko.observable();
self.lastName = ko.observable();
self.activities = ko.observableArray();
self.favoriteHobby = ko.observable();
self.loadUserData = function() {
return $.getJSON("/get-user-data.json", function (result) {
self.firstName(result.firstName)
.lastName(result.lastName)
.favoriteHobby(result.favoriteHobby)
.activites(result.activities);
});
}
}
ko.applyBindings(new PersonViewModel());
在淘汰赛,你使用observables更新你的用户界面。你可以不**应用绑定两次,就像你在'loadUserData'的回调中做的那样。我建议阅读教程,以了解如何使用服务器中的数据更新视图模型。 – user3297291