如何获得击倒可观察对象绑定击倒映射

How to get back knockout observable binded by knockout-mapping

本文关键字:绑定 映射 对象 何获得 观察      更新时间:2023-09-26

我已经绑定了我的json数组击倒使用击倒映射插件

JSON

{
   "info":[
      {
         "Name":"Noob Here",
         "Major":"Language",
         "Sex":"Male",
         "English":"15",
         "Japanese":"5",
         "Calculus":"0",
         "Geometry":"20"
      },
      {
         "Name":"Noob Here",
         "Major":"Calculus",
         "Sex":"Female",
         "English":"0.5",
         "Japanese":"40",
         "Calculus":"20",
         "Geometry":"05"
      }
   ]
}

使用knockout-mapping插件绑定

var data = [];
$.each(data1.info, function (index, element) {
            data.push({
                English: element.English,
                Japanese: element.Japanese,
                Calculus: element.Calculus,
                Geometry: element.Geometry,
                name: element.Name,
                major: element.Major,
                sex: element.Sex
            });
        });
        dataFunction.prototype = function () {
            var getAllItems = function () {
                var self = this;
                ko.mapping.fromJS(data, {}, self.Items);
            };

现在我想提醒英语的价值。

我试了alert(this.English());dataFunction.prototype里面,它不工作。

如何提醒该值?

JS-Bin代码:http://jsbin.com/ipeseq/4/edit

您需要定义一个适当的视图模型,并在您的标记中使用它。

我把一个视图模型和一个自定义视图模型映射在一起,我把你的数据映射到对象中,我称之为"学生",你可以在你的标记中使用。这个对象我扩展了一个ko.computed来计算总数(在这个对象中你可以读取和操作你的observable )。

 var Student = function(data) {
 var self = this;
 ko.mapping.fromJS(data, { }, self);
 self.total = ko.computed(function() { // Calculate total here
   return self.English() + self.Japanese() + self.Calculus() + self.Geometry();
    });
 };
var viewModelMapping = {  // Map all objects in 'info' to Student objects
'info': {
 create: function(options) {
        return new Student(options.data);
        }
    }
};
var ViewModel = function(data) {  // Create a view model using the mapping
    var self = this;
    ko.mapping.fromJS(data,viewModelMapping,self);
}
$(document).ready(function () {
    vm = new ViewModel(data);
    ko.applyBindings(vm);
});      

您可以在这里看到生成的JSBin代码

你可以在使用" create "自定义对象构造使用" update " 章节中阅读更多内容