Jquery 在knockoutjs“;未捕获错误:无法分析绑定;错误,但代码可以工作
我正在使用knockout js映射,在尝试执行示例时,我遇到了控制台错误 未捕获错误:无法分析绑定。消息:ReferenceError: loadUserData未定义;绑定值:单击:loadUserData 这里是代码Jquery 在knockoutjs“;未捕获错误:无法分析绑定;错误,但代码可以工作,jquery,knockout.js,knockout-mapping-plugin,Jquery,Knockout.js,Knockout Mapping Plugin,我正在使用knockout js映射,在尝试执行示例时,我遇到了控制台错误 未捕获错误:无法分析绑定。消息:ReferenceError: loadUserData未定义;绑定值:单击:loadUserData 这里是代码 <form action="#" method="post"> <p>First name: <input data-bind='value: firstName' /></p> <p>Last na
<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>
单击“加载数据”按钮时,会出现错误,但示例有效,如何清除此错误。正如@user3297291所指出的,您不能调用ko.applyBindings两次。取而代之的是,使视图模型的属性可以被观察到,当它们发生变化时,knockout将自动更新您的UI:
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());
在knockout中,您可以通过使用可观察项来更新UI。您不能像在
loadUserData
的回调中那样应用绑定两次。我建议阅读教程,了解如何使用服务器上的数据更新viewmodel。
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());