2012-03-21 30 views
6

मैं knockout.js के साथ एक समस्या और स्रोत डेटाKnockout.js मानचित्रण बच्चे मॉडल

var data = { 
    outer: [ 
     { 
     'id': 1, 
     name: 'test outer', 
     inner: [{ 
      'id': 1, 
      name: 'test inner'}]}] 
}; 

function OuterModel(data) { 
    var self = this; 
    ko.mapping.fromJS(data, {}, this); 

    self.fullText = ko.computed(function() { 
     return self.id() + ". " + self.name(); 
    }); 
} 

function InnerModel(data, parent) { 
    var self = this; 
    ko.mapping.fromJS(data, {}, this); 

    self.fullText = ko.computed(function() { 
     return self.id() + ". " + self.name() + "(" + parent + ")"; 
    }); 
} 

function PageModel() { 
    var self = this; 
    this.data = null; 
} 

var mapping = { 
    'outer': { 
     key: function(data) { 
      return ko.utils.unwrapObservable(data.id); 
     }, 
     create: function(options) { 
      var thisModel = new OuterModel(options.data); 
      return thisModel; 
     } 
    }, 
    'inner': { 
     key: function(data) { 
      return ko.utils.unwrapObservable(data.id); 
     }, 
     create: function(options) { 
      var thisModel = new InnerModel(options.data); 
      return thisModel; 
     } 
    } 
}; 

var model = new PageModel(); 
model.data = ko.mapping.fromJS(data, mapping); 

में बच्चे सरणियों के लिए मॉडल बनाने नहीं (यह एक रेपो का एक छोटा सा है मानचित्रण प्लगइन आ रही बाध्यकारी नहीं मैं इसके लिए कर सकता हूं। यहां उपलब्ध फिडल: http://jsfiddle.net/msieker/6Wx3s/)

संक्षेप में, इनरमोडेल कन्स्ट्रक्टर को कभी नहीं कहा जाता है। मैंने 'InnerModel' दोनों के साथ इस स्निपेट में और 'inner' मैपिंग के भीतर यह कोशिश की है। मैंने जो देखा है उसके अधिकांश खातों से, यह सिर्फ काम करना चाहिए, लेकिन जाहिर है कि मुझे कुछ याद आ रहा है।

किसी के पास इसका अनुभव है जो मुझे सही दिशा में इंगित कर सकता है?

संपादित करें: @ जॉन अर्लेस जवाब के आधार पर, मैं इस एक सा के करीब मिल गया है कि मैं क्या जरूरत है:

var data = { 
    outer: [ 
     { 
     'id': 1, 
     name: 'test outer', 
     inner: [{ 
      'id': 1, 
      name: 'test inner'}]}] 
}; 

var outerMapping = { 
    'outer': { 
     key: function(data) { 
      return ko.utils.unwrapObservable(data.id); 
     }, 
     create: function(options) { 
      var thisModel = new OuterModel(options.data); 
      return thisModel; 
     } 
    } 
}; 

function OuterModel(data) { 
    var self = this; 
    ko.mapping.fromJS(data, innerMapping, this); 

    self.fullText = ko.computed(function() { 
     return self.id() + ". " + self.name(); 
    }); 
} 

var innerMapping = { 
    'inner': { 
     key: function(data) { 
      return ko.utils.unwrapObservable(data.id); 
     }, 
     create: function(options) { 
      console.log(options); 
      var thisModel = new InnerModel(options.data, options.parent()); 
      return thisModel; 
     } 
    } 
}; 

function InnerModel(data, parent) { 
    var self = this; 
    ko.mapping.fromJS(data, {}, this); 

    self.fullText = ko.computed(function() { 
     return self.id() + ". " + self.name() + "(" + parent + ")"; 
    }); 
} 

function PageModel() { 
    var self = this; 
    this.data = null; 
} 

var model = new PageModel(); 
model.data = ko.mapping.fromJS(data, outerMapping); 
ko.applyBindings(model);? 

हालांकि, parent InnerModel के लिए पारित हो जाता है कि null है, जो हो रही है यही कारण है कि मैं मैपिंग प्लगइन का पीछा कर रहा हूं। दस्तावेज़ मुझे विश्वास करते हैं कि पैरामीटर पर create फ़ंक्शन पर इसे पारित किया जाना चाहिए, लेकिन इसके बजाय मुझे observable मिलता है जिसका मान null है। इस दिशा में कोई अतिरिक्त संकेतक?

+0

दुर्भाग्य से माता-पिता आप क्या चाहते करने के लिए नहीं जा रहा है:

इस बेला जवाब बाहर मैप करता है। इस मामले में अभिभावक आपके सरणी को देता है कि नया आइटम उस वस्तु का हिस्सा है, उस वस्तु में नहीं है। आपको पेरेंट एसोसिएशन खुद को बनाना होगा। इस तरह: http://jsfiddle.net/jearles/6Wx3s/5/ –

+0

आप इसे http://stackoverflow.com/questions/9951521/map-json-data-to-knockout-observablearray-with- विशिष्ट- देखें-मॉडल-प्रकार इसने मेरे माता-पिता मैपिंग के साथ अपने मुद्दों को हल किया – Naveen

उत्तर

2

आप बाहरी मैडल मैपिंग कॉल में अपने मैपिंग विकल्प (जो आंतरिक रूप से मानचित्र कैसे परिभाषित करते हैं) को पास नहीं कर रहे हैं।

function OuterModel(data) { 
    var self = this; 
    ko.mapping.fromJS(data, mapping, this); 

    self.fullText = ko.computed(function() { 
     return self.id() + ". " + self.name(); 
    }); 
} 

संपादित करें: अपडेट किया गया बेला माता पिता की पुस्तिका लगाव दिखाने के लिए:

http://jsfiddle.net/jearles/6Wx3s/5/

1

मैं एक समय पहले एक बहुत ही इसी तरह के परिदृश्य था, क्यू यहाँ & एक बाहर की जाँच: Map JSON data to Knockout observableArray with specific view model type

मेरे उदाहरण में मेरे पास एक StateViewModel है जिसमें 2 CityViewModels के साथ एक अवलोकन योग्य ऐरे है, और प्रत्येक सिटी व्यू मॉडेल में एक अवलोकन योग्य है जिसमें 2 स्ट्रीट व्यू मॉडल्स के साथ आबादी है।

तब मैं चाहता था कि इस दृश्य मॉडल संरचना को मेरे पदानुक्रमित जेसन डेटा से नॉकआउट मैपिंग प्लगइन का उपयोग करके बनाया जाए। http://jsfiddle.net/KodeKreachor/pTEbA/2/

संबंधित मुद्दे