问题描述
我想以JSON格式在隐藏字段中保存视图模型。一切正常。
I want to save view model in the hidden field in JSON format. All work fine.
但是当我试图得到它时 - 我收到错误:
But when I try to get it - I get error:
viewModel
function AppViewModel() {
//Week
this.AllCheck = ko.observable(false);
this.DaysOfWeekResult = ko.observableArray();
this.selectAll = function () {
if (this.AllCheck()) {
viewModel.DaysOfWeekResult.removeAll();
viewModel.DaysOfWeekResult.push("Mo");
viewModel.DaysOfWeekResult.push("Tu");
viewModel.DaysOfWeekResult.push("We");
viewModel.DaysOfWeekResult.push("Th");
viewModel.DaysOfWeekResult.push("Fr");
viewModel.DaysOfWeekResult.push("Sa");
viewModel.DaysOfWeekResult.push("Su");
}
return true;
};
this.dayClicked = function () {
checkDays();
return true;
};
}
初始化代码
var viewModel;
$().ready(function (){
viewModel = new AppViewModel();
var viewModelDeserialized = ko.mapping.fromJSON(serializedJsonString, viewModel);
ko.applyBindings(viewModel);
});
function checkDays() {
viewModel.AllCheck(viewModel.DaysOfWeekResult().length == 7);
}
序列化模型
var serializedJsonString = '"AllCheck":false,"DaysOfWeekResult":[]}';
MarkUp
<div class="check-block">
<input name="AllWeek" id="AllWeek" type="checkbox" value="AllWeek" data-bind="checked: AllCheck, click: selectAll" />
<label for="AllWeek">All Week</label>
</div>
<div class="holder">
<span>
<input name="Monday" id="Monday" type="checkbox" value="Mo" data-day="true" data-bind="checked: DaysOfWeekResult, click: dayClicked" />
<label for="Monday">Mo</label>
</span><span>
<input name="Tuesday" id="Tuesday" type="checkbox" value="Tu" data-day="true" data-bind="checked: DaysOfWeekResult, click: dayClicked" />
<label for="Tuesday">Tu</label>
</span><span>
<input name="Wednesday" id="Wednesday" type="checkbox" value="We" data-day="true" data-bind="checked: DaysOfWeekResult, click: dayClicked" />
<label for="Wednesday">We</label>
</span>
<span>
<input name="Thursday" id="Thursday" type="checkbox" value="Th" data-day="true" data-bind="checked: DaysOfWeekResult, click: dayClicked" />
<label for="Thursday">Th</label>
</span><span>
<input name="Friday" id="Friday" type="checkbox" value="Fr" data-day="true" data-bind="checked: DaysOfWeekResult, click: dayClicked" />
<label for="Friday">Fr</label>
</span><span>
<input name="Saturday" id="Saturday" type="checkbox" value="Sa" data-day="true" data-bind="checked: DaysOfWeekResult, click: dayClicked" />
<label for="Saturday">Sa</label>
</span><span>
<input name="Sunday" id="Sunday" type="checkbox" value="Su" data-day="true" data-bind="checked: DaysOfWeekResult, click: dayClicked" />
<label for="Sunday">Su</label>
</span>
</div>
推荐答案
你用错误的参数调用 ko.mapping.fromJSON
。
正确用法你的情况如下:
The correct usage in your case is the following:
var viewModelDeserialized =
ko.mapping.fromJSON(serializedJsonString, {} /* empty options */, viewModel);
(没有绑定错误)
使用 ko.mapping.fromJSON
方法有点棘手:
-
你可以用一个参数:仅提供数据,例如
var viewModel = ko.mapping.fromJSON(data)
在这种情况下,它将返回创建的viewModel
you can call it with one argument: providing just the data e.g
var viewModel = ko.mapping.fromJSON(data)
in this case it will return the created viewModel
您可以使用两个参数调用:
- 如果第二个参数是ko映射创建viewModel然后它被视为映射目标
ko.mapping.fromJSON(data,koMappingCreatedViewModel)
- 否则第二个参数被视为映射选项(在您的情况下会发生这种情况)
var viewModel = ko.mapping.fromJSON(data,options)
- if the second argument is a ko mapping created viewModel then it is treated as the mapping target
ko.mapping.fromJSON(data, koMappingCreatedViewModel)
- otherwise the second argument is treated as the mapping options (this happens in your case)
var viewModel = ko.mapping.fromJSON(data, options)
你可以用三个参数明确指定它来调用它数据,映射和目标: ko.mapping.fromJSON(数据,选项,目标)
you can call it with three arguments explicitly specifing the data, mapping and target: ko.mapping.fromJSON(data, options, target)
这篇关于无法解析绑定js错误使用ko.mapping.fromJSON与解析存在的视图模型的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!