在我看来,Knockout.js ko.mapping.toJS 没有刷新数据
我从服务器获取一个 json 对象并填充我的视图。然后我更改数据,将其推回服务器。然后,我获取数据的新副本,希望它能通过任何更改刷新我的视图。然而这并没有发生。 TIA
$(document).ready(function() {
var customer_id = get_customer_id();
var data = load_model();
contract_model = ko.mapping.fromJS(data,{});
ko.applyBindings(contract_model);
}
function load_model(){
var url = '/ar/contract_json?contract_id='+get_contract_id();
var data = '';
$.ajax({
type:'GET',
url:url,
async:false,
success: function(returningValue){
data = returningValue;
}
});
return data;
}
此初始负载工作正常。然后我做一些事情并更改其中一个可观察值并将该数据推送回服务器。服务器获取更新,然后我对数据进行新的获取,以便视图将刷新(我知道我可以一步传回新数据,但这在我尚未重构的代码中)。
function refresh_data(contract_model){
var url = '/ar/contract_json?contract_id='+get_contract_id();
$.post(url,function(data){
console.log(data);
ko.mapping.fromJS(contract_model,{},data);
ko.applyBindings(contract_model);
console.log(ko.mapping.toJS(contract_model))
});
}
function refresh_data(contract_model){
var url = '/ar/contract_json?contract_id='+get_contract_id();
$.post(url,function(data){
console.log(data);
ko.mapping.fromJS(contract_model,{},data);
console.log(ko.mapping.toJS(contract_model))
});
}
function push_model(contract_model,refresh){
var url = '/ar/update_contract';
var data = {'contract':ko.mapping.toJSON(contract_model)}
delete data['lines'];
$.post(url,data,function(return_value){
if (refresh){
refresh_data(contract_model);
};
});
}
控制台消息都显示返回的新数据,但我的视图从未更新。
I fetch a json object from the server and populate my view. I then change the data, push it back to the server. I then fetch a new copy of the data hoping it will refresh my view with any changes. However that doesn't happen. TIA
$(document).ready(function() {
var customer_id = get_customer_id();
var data = load_model();
contract_model = ko.mapping.fromJS(data,{});
ko.applyBindings(contract_model);
}
function load_model(){
var url = '/ar/contract_json?contract_id='+get_contract_id();
var data = '';
$.ajax({
type:'GET',
url:url,
async:false,
success: function(returningValue){
data = returningValue;
}
});
return data;
}
This initial load works fine. I then do some stuff and change one of the observables and push that data back to server. Server gets the update and then I do a new fetch of the data so that view will refresh (i know i can pass back the new data in one step but this in code i haven't refactored yet).
function refresh_data(contract_model){
var url = '/ar/contract_json?contract_id='+get_contract_id();
$.post(url,function(data){
console.log(data);
ko.mapping.fromJS(contract_model,{},data);
ko.applyBindings(contract_model);
console.log(ko.mapping.toJS(contract_model))
});
}
function refresh_data(contract_model){
var url = '/ar/contract_json?contract_id='+get_contract_id();
$.post(url,function(data){
console.log(data);
ko.mapping.fromJS(contract_model,{},data);
console.log(ko.mapping.toJS(contract_model))
});
}
function push_model(contract_model,refresh){
var url = '/ar/update_contract';
var data = {'contract':ko.mapping.toJSON(contract_model)}
delete data['lines'];
$.post(url,data,function(return_value){
if (refresh){
refresh_data(contract_model);
};
});
}
The console messages all show the new data coming back but my view never updates.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
我认为问题在于更新
contract_model
时传入ko.mapping.fromJS
函数的参数顺序。你有:
你想要:
I believe the problem is with the order of parameters you pass into the
ko.mapping.fromJS
function when you are updatingcontract_model
.You have:
you want:
@seth.miller 的答案是正确的。如果您的
contract_model
与之前映射的参数相同,您也可以省略中间的“options”参数。如果只有两个参数,ko.mapping.fromJS
会检查第二个参数是否具有"__ko_mapping__"
属性。如果是,则将其视为目标,否则将其视为选项对象。@seth.miller's answer is correct. You can also leave out the middle "options" parameter if your
contract_model
is the same one that was mapped earlier. If there are only two arguments,ko.mapping.fromJS
checks if the second argument has a"__ko_mapping__"
property. If so, it treats it as a target, otherwise it treats it as an options object.根据 @DBueno 的观察 - 对于任何使用打字稿的人,我强烈建议从您的
knockout.mapping.d.ts
文件中注释掉此方法签名。是的 - 只需将其注释掉即可。
如果您尝试执行以下操作,您将收到编译时错误:
您可以将其替换为更安全 更
安全,因为无论
item.target
之前是否已映射(因此将具有__ko_mapping__
属性),它总是会复制属性。Based upon @DBueno's observation - for anyone using typescript I strongly recommend commenting out this method signature from your
knockout.mapping.d.ts
file.Yes - just comment it out.
You'll then get a compile time error if you try to do :
and you can replace it with the much safer
Safer because whether or not
item.target
has been previously mapped (and therfore would have a__ko_mapping__
property) it will always copy the properties.