value-binding in KnockoutJs Auftritt wählen, wenn Sie mit komplexen Typen

Ich bin versucht, die Wert-Bindung auf das select-element, wie in dieser Fiedel: http://jsfiddle.net/MikeEast/nM6dd/2/

Aber ich kann nicht scheinen, um in der Lage sein, um die gewählte option (value-binding).

Ich weiß, ich kann die optionsValue Bindung, aber das macht der Wert einen string statt einem Objekt, das nicht vorzuziehen ist. Wenn das der einzige Weg zu gehen, wie würde ich tun, um sicherzustellen, dass die ausgewählte option zurück geschrieben das view-Modell?

Dank!

InformationsquelleAutor Mikael Östberg | 2011-12-22

  1. 17

    Hier ist die Lösung. Sie haben, um das Attribut hinzufügen optionsValue: 'id' an die Daten zu binden.
    Sie haben auch eine Funktion in der man viewModel, das gibt das ausgewählte Objekt.

    HTML

    <select data-bind="options: items, optionsText: 'name', optionsValue: 'id', value: selectedItemId"></select>
<span data-bind="text: selectedItem().name"></span>

    JS

    var viewModel = function () {
   this.items = ko.observableArray([
       { id: 1, name: "Apple" }, 
       { id: 2, name: "Orange"},
       { id: 3, name: "Banana"}
   ]);
   this.selectedItemId = ko.observable(3);
   this.selectedItem = function() {
       var self = this;
       return ko.utils.arrayFirst(this.items(), function(item) {
           return self.selectedItemId() == item.id;
       });
   }.bind(this);
};

var vm = new viewModel();
ko.applyBindings(vm);

    Prost!

    Danke für deinen Beitrag. Es tut lösen die Frage, die ich fragte. Aber mein problem ist begründet durch eine andere Ursache als diese. Ich bin laden das array vom server asynchron und wenn ich die Antwort habe ich den Wert der observableArray. Dies bedeutet, dass die observableArray lädt/bindet, was wiederum macht es ignorieren, die Wert, die zuvor festgelegt. Das könnte sein, vom design, aber ich bin mir nicht sicher. Hier ist ein Turnschuh zeigt das Verhalten: jsfiddle.net/MikeEast/nM6dd/12
    Ich sehe. Das problem ist, dass diese.ausgewählt ist eine beobachtbare und es ist auf 2 gesetzt. Durch design-knockout-können den Wert ändern, auf dieser.ausgewählt, wenn Sie den Wert ändern auf der Liste. Da die Liste zunächst leer.ausgewählt wird nicht definiert. Wenn Sie füllen Sie es standardmäßig legt zum ersten Element. Sie können dies lösen, indem das speichern der aktuell ausgewählte Element in einer eigenen variable und mit Hilfe der Funktion abonnieren in knockout.

    InformationsquelleAutor Andreas Helgegren

Schreibe einen Kommentar