2013-03-20 13 views
10

Ich bin mit KnockoutJS des Mapping-Plugin in ein Problem laufen, wo ich folgendes tun müssen:Knockout Mapping - Fertigen Sie mit Nested erstellen Objekte

  1. Passen Sie die Zuordnung Erzeugung eines Objekts
  2. Passen Sie die Zuordnung Schaffung eines Arrays verschachtelter Objekte aus # 1.

In diesem fiddle example Ich versuche haben die Kinder richtig auf ihre individuelle Schöpfung abgebildet. Das erwartete Ergebnis ist, dass jeder der Kinder die Beschreibung Eigenschaft hat. Von der Geige, soll das Ergebnis lesen:

  • Adam Smith
  • Bob ist 5 Jahre alt
  • Chris ist 7 Jahre alt

ich das erwartete Verhalten in diesen diesen fiddle example nachweisen kann. Beachten Sie, dass ich in diesem Code zwei Datensätze haben muss, von denen der erste ein leeres Array von untergeordneten Objekten hat. Die folgende Codezeile wird die angepasste Erstellung von untergeordneten Objekten verursacht:

ko.mapping.fromJS(additionalData, parentMapping, viewModel); 

Leider erfordert dies sowohl mit leeren Anfängen Kinder und Mapping zweimal. Dies ist nicht akzeptabel, da der Code in Wirklichkeit eine viel tiefere Hierarchie hat.

Zusätzlich zu den oben genannten, habe ich versucht, den folgenden Code in der parentMapping Zugabe:

var mapping = { 'ignore': ["children"] }; 
var innerModel = ko.mapping.fromJS(options.data, mapping); 
//for brevity 
innerModel.children = ko.mapping.fromJS(options.data.children, childMapping); 

Dies hat den Effekt des Abbildens der Kinder Objekte auf der ersten Kartierung. Bei allen nachfolgenden Zuordnungen wird die untergeordnete-Eigenschaft ignoriert.

Gibt es eine Möglichkeit, die Erstellung von Eltern- und Child-Objekten mit Knockout Mapping anzupassen?

Vielen Dank.

+0

Ist dies eine Verwendung für Sie? http://stackoverflow.com/questions/15480316/knockout-dynamic-binding-issue/15480602?noredirect=1#comment21977967_15480602 –

+0

Danke Paul, diese Lösung funktioniert für mich. –

Antwort

16

http://jsfiddle.net/5cfa3/23/

var viewModel = {}; 

var data = { 
    id: "1", 
    firstName: 'Adam', 
    lastName: "Smith", 
    children: [ {id: "2", name: "Bob", age: 5}, {id: "3", name: "Chris", age: 7 }] 
}; 

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

var mapping = { 
    create:function(options){ 
    var parent = new Parent(options.data); 
    parent.fullName = ko.computed(function(){ 
     return parent.firstName() + " " + parent.lastName(); 
    }); 
    return parent; 
    }, 
    'children': { 
    create: function(options) { 
     options.data.description = ko.computed(function(){ 
      return options.data.name + " is " + options.data.age + " years old "; 
     }); 
     return ko.mapping.fromJS(options.data);   
    } 
    } 
}; 

viewModel = ko.mapping.fromJS(data, mapping); 

ko.applyBindings(viewModel); 
+0

Danke. Das ist, was ich gesucht habe. –