1

私はknockout.jsに取り組んでいます。私はknockout.jsを初めて使用するので、nomkout.jsチュートリアルに従ってください。ドロップダウンリストにアイテムのリストを表示しようとしていますが、これは基本的に、knockout.jsチュートリアルで提供されている実際の例です。私は次のコードを書きました、

<script type="text/javascript">
        $(document).ready(function () {
            function setreservation(name, initmeal) {
                var self = this;
                self.Name = name;
                self.Meal = ko.observable(initmeal);

                self.FormatPrice = ko.computed(function () {
                    return self.Meal().Price ? "$" + self.Meal().Price.toFixed(2) : "none";
                });
            }

            function ReservationViewModel() {
                var self = this;
                self.availablemeals = [{ "MealName": "standard", "Price": 10 }, { "MealName": "premium", "Price": 20 }, { "MealName": "Platinum", "Price": 30}];
                self.seats = ko.observableArray([new setreservation("karthik", self.availablemeals[0]), new setreservation("Tirumalesh", self.availablemeals[1])]);
                self.ReserveNewSeat = function () {
                    self.seats.push(new setreservation("karhik", self.availablemeals[2]));
                };
            }

            ko.applyBindings(new ReservationViewModel());
        }); 

私の見解は、

<table cellpadding="3" cellspacing="4">
<thead>
<tr>
<th>Name</th><th>Meal</th><th>Price</th>
</tr>
</thead>
<tbody data-bind="foreach: seats">
<tr>
<td><input data-bind="value:Name" /> 
</td>
<td><select data-bind="options:$root.availablemeals,value:Meal,optionsText:MealName"></select></td>
<td data-bind="text:FormatPrice"></td>
</tr>
</tbody>
</table>
<button data-bind="click:ReserveNewSeat">Reserve New One</button>

だから私に教えてください私のコードは何か間違ったことをしますか?

4

1 に答える 1

3

あなたはバインディングを逃し''ました:optionsText

<select data-bind="options: $root.availablemeals, value: Meal, optionsText: 'MealName'">

ここに作業中のフィドルがあります:http://jsfiddle.net/vyshniakov/DRDGK/

于 2012-10-16T13:24:56.287 に答える