无法使用映射插件映射数据?昏死 [英] Unable to map the Data using mapping plugin ? Knockout

问题描述

我试图绑定我的数据以查看，但是我的所有尝试都没有成功.

I am trying to bind my data to view but i am unsuccessful in all my attempts .

我将一个数据数组存储在一个变量中，然后使用映射插件，并且我将这些数据作为可观察的对象绑定到视图.

There is a Array of data i'm storing in a variable and later using mapping plugin and i am making those as observable's to bind it to view .

有趣的是，我在console中没有任何错误，并且通过

Interesting thing here is i am getting no errors in console and i checked with

<span data-bind="text: ko.toJSON(Item)"></span> 

我可以看到我的数组，但看不到它绑定到视图.

I can see my array but i can't see it binded to view .

脚本代码:

console.log(ko.mapping.fromJS(jsonData));
var viewModel = new MainModel();
viewModel.Item(ko.mapping.fromJS(jsonData));
ko.applyBindings(viewModel);

小提琴链接为 此处 .

Fiddle link is Here .

这是我关于映射插件的第一步.请向我推荐使用映射插件构建一些复杂事物的参考.

This is my first trail on the mapping plugin .Please do suggest me a reference to build some complex things using mapping plugin .

如果有更好的方法是可取的.

Any better approach is advisable if .

推荐答案

我不记得了，但这与我两天前问的问题相同.

I don't remember but it is same as question I ask two days back.

我想，如果您想解决类似的问题，我已经解决了，您可以在更新的小提琴中找到它.我还将淘汰赛版本更新为3.2.0.

I think if you want similar once problem I have solved it and you can find it on your updated fiddle. I also updated knockout version to 3.2.0.

http://jsfiddle.net/C46pU/9/

var mapping = {
    'Items': {
        create: function(options) {
            console.log('Inside Mapping Item');
            return new ChildModel(options.data);
        }
    },
     'Value': {
         create: function(options){
                  console.log('Inside Mapping Value');
                  return new ChildModel(options.data);
         }
       }
 };

$(document).ready(function () {

           var jsonData = {"Items":[{"Value":[{"Value1":"1","Value2":"2"},{"Value1":"3","Value2":"4"}]},{"SelectedOption":["Item2"],"Value":[{"Value1":"5","Value2":"6"},{"Value1":"7","Value2":"8"},{"Value1":"9","Value2":"10"}]}]};

         var viewModel = new MainModel(jsonData);                    
         ko.applyBindings(viewModel);                         
        });

        function ValueModel() {
            var self = this;
            self.Value1 = ko.observable();
            self.Value2 = ko.observable();
        }

        function ChildModel(data) {
            var self = this;
            self.SelectedOption = ko.observable();
            self.Value = ko.observableArray([]);
            if(data != null)
            {
                console.log(data);
                ko.mapping.fromJS(data,mapping,self);
            }
            self.AddValue = function () {
                self.Value.push(new ValueModel());
            }
        }


        function MainModel(data) {
            var self = this;            
            self.Items = ko.observableArray([]);
            if(data != null)
            {
                console.log('Inside Main Model');
                console.log(data);
                ko.mapping.fromJS(data,mapping, self);
            }           

            self.dropDownItem = ko.observableArray(['Item1', 'Item2', 'Item3', 'Item4']);

            self.AddItem = function () {
                self.Items.push(new ChildModel());
            }
        }

这篇关于无法使用映射插件映射数据?昏死的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！