javascript 将 Knockout js json 转换为 observable
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/15051699/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Converting Knockout js json to observable
提问by user517406
I am struggling to return JSON data and convert it into an observable. The data is returned fine in JSON format, but it doesn't seem to be assigned to the observable. Can anybody help? I am guessing the issue is in the success part of the ajax call :
我正在努力返回 JSON 数据并将其转换为 observable。数据以 JSON 格式返回正常,但它似乎没有分配给可观察对象。有人可以帮忙吗?我猜问题出在 ajax 调用的成功部分:
<script type="text/javascript">
function StandingsViewModel() {
var self = this;
self.standings = ko.observableArray();
self.DivisionName = ko.observable('');
self.afceast = ko.computed(function () {
return ko.utils.arrayFilter(self.standings(), function (i) {
return "AFC East" == i.DivisionName;
});
});
self.afccentral = ko.computed(function () {
return ko.utils.arrayFilter(self.standings(), function (i) {
return "AFC Central" == i.DivisionName;
});
});
self.afcwest = ko.computed(function () {
return ko.utils.arrayFilter(self.standings(), function (i) {
return "AFC West" == i.DivisionName;
});
});
self.nfceast = ko.computed(function () {
return ko.utils.arrayFilter(self.standings(), function (i) {
return "NFC East" == i.DivisionName;
});
});
self.nfccentral = ko.computed(function () {
return ko.utils.arrayFilter(self.standings(), function (i) {
return "NFC Central" == i.DivisionName;
});
});
self.nfcwest = ko.computed(function () {
return ko.utils.arrayFilter(self.standings(), function (i) {
return "NFC West" == i.DivisionName;
});
});
$.ajax({
dataType: "json",
url: "/api/standing/GetStandingsBySeason/2018",
beforeSend: function (xhr) {
$('#divStandings').html('');
$('#divStandings').addClass('ajaxRefreshing');
xhr.setRequestHeader('X-Client', 'jQuery');
},
success: function (result) {
$('#divStandings').removeClass('ajaxRefreshing');
self.standings(JSON.parse(result));
}
});
}
$(document).ready(function () {
ko.applyBindings(new StandingsViewModel());
});
</script>
回答by S?awomir Rosiek
You should use Knockout Mappingplugin and map your result to observable.
您应该使用Knockout Mapping插件并将您的结果映射到 observable。
var observableData = ko.mapping.fromJS(result);
or if your object wasn't parsed automatically by jQuery
或者如果您的对象没有被 jQuery 自动解析
var observableData = ko.mapping.fromJSON(result);
If your data type is array it will be converter to observableArray, so to get it items as normal array you should get like from any other observable by adding brackets;
如果您的数据类型是数组,它将被转换为 observableArray,因此要将其作为普通数组获取项目,您应该通过添加括号从任何其他 observable 中获取;
var array = observableData();
That array can by assigned to your obsevableArray in that way:
该数组可以通过这种方式分配给您的 obsevableArray:
self.standings(array);
回答by Alerty
An alternative option to using the mapping plugin for Knockout would be to use Knockback. It is a bridge between Knockout and Backbone.
将映射插件用于 Knockout 的另一种选择是使用Knockback。它是 Knockout 和Backbone之间的桥梁。
You easily get your data like so:
您可以像这样轻松获取数据:
//Model
var StandingsModel = Backbone.Collection.extend({
url:'/api/standing/GetStandingsBySeason/2018'
});
//View model
var StandingsViewModel = function (standings) {
this.standings = kb.collectionObservable(standings)
//...
};
$(document).ready(function () {
//Get data from server
var model = new StandingsModel();
model.fetch( function() {
success: //...
});
//Apply bindings
ko.applyBindings(new StandingsViewModel(model));
});