Wie können Objekteigenschaften in einem beobachtbaren Knockout-Array beobachtbar gemacht werden?

Question

Wenn die Option 'create' im Knockout-Mapping verwendet wird, würden wir das Array zu einem beobachtbaren Array machen. Aber wie machen wir die Eigenschaften jedes Objekts im beobachtbaren Array beobachtbar?

In diesem Beispiel aus der Knockout-Dokumentation wird das Children-Array zu einem beobachtbaren Array gemacht, aber ich möchte alle Elemente wie id, name innerhalb jedes Objekt-Literals auch zu einem Observablen machen. Wie erreichen wir das? Setzen Sie einfach ein ko.observable auf jedes neue Objekt im create Block?

var data = { 
    name: 'Graham', 
    children: [ 
     { id : 1, name : 'Lisa' } 
    ] 
}; 

// Your custom data model 
var myChildModel = function (data) { 
    this.id = data.id; 
    this.name = data.name; 
}; 

var mapping = { 
    'children': { 
     create: function(options) { 
      return new myChildModel(options.data); 
     } 
    } 
}; 

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

Answer 1

Per der documentation:

• Alle Eigenschaften eines Objekts in einen beobachtbaren umgewandelt.

So unten im Abschnitt über Customizing Objektkonstruktion mit „create“ heißt es

Natürlich innerhalb der Rückruf erstellen, können Sie einen weiteren Anruf zu ko.mapping.fromJS tun, wenn du wünschst.

Das Beispiel vorgesehen ist wie folgt:

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

    this.nameLength = ko.computed(function() { 
    return this.name().length; 
    }, this); 
} 

Natürlich ist dies die alle Eigenschaften umwandeln würde. Eine detailliertere Konfiguration könnte dann speziell auf diesen Mapping-Aufruf angewendet werden, um benutzerdefinierte Anforderungen zu behandeln.

Answer 2

Die schnelle Antwort ist, die Eigenschaften des Objekts machen beobachtbaren

var myChildModel = function (data) { 
    this.id = ko.observable(data.id); 
    this.name = ko.observable(data.name); 
; 

Es ist auch wahrscheinlich der einfachste Weg, aber es gibt andere

Answer 3

einfach:

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

Es tut alles, Machen Sie beide Eigenschaften und Arrays beobachtbar. Der zweite Parameter dieser Methode dient nur zur Anpassung. Sie müssen es nicht verwenden, wenn Sie nicht brauchen!