Javascript 在敲除器中计算出的可观测值'；你不知道变化的最新情况吗？

我目前正在学习knockoutjs，我只是在学习knockoutjs官方网站上关于列表和收藏的教程，目前我拥有的是一个下拉列表，其中列出了我拥有的物品，然后旁边是一个显示文本（价格）的文本，现在我想做的是，显示的文本应该根据下拉列表中的选定项进行更改

以下是我的代码：

此外，如果您注意到我的代码除了上面提到的以外还有一些错误，请务必建议我，以获得最佳实践或更正

// Class to represent a row in the seat reservations grid
function SeatReservation(name, initialMeal) {
    //var self = this;
    //self.name = ko.observable(name);
    this.name = name;
    this.meal = ko.observable(initialMeal);
    this.formattedPrice = ko.computed(function () {
        var price = this.meal().price;
        return price ? "$" + price.toFixed(2) : "None";
    }, this);
}

function ReservationsViewModel(name, meal) {
    //var self = this;
    // Non-editable catalog data - would come from the server
    this.availableMeals = [
        { mealId: 1, mealName: "Standard (sandwich)", price: 47.55 },
        { mealId: 2, mealName: "Premium (lobster)", price: 34.95 },
        { mealId: 3, mealName: "Ultimate (whole zebra)", price: 290.123 }
    ];

    //editable data
    this.seats = ko.observableArray([
        new SeatReservation("Randel", this.availableMeals[2]),
        new SeatReservation("Knockout", this.availableMeals[1])
    ]);

    //operations
    this.addSeat = function () {
        this.seats.push(new SeatReservation("", this.availableMeals[0]));
    };

    this.removeSeat = function (seat) {
        this.seats.remove(seat);
    ;}
}

ko.applyBindings(new ReservationsViewModel());

---

先生/女士，您的回答将大有帮助。谢谢你+++

你唯一真正需要改变的是选项绑定参数

您正在使用

选项value

，然后尝试更新

用餐

属性上的id。这将覆盖

mealId

属性，而不更改它所引用的对象

。请注意，由于

mealId

不可见，因此必须单击刷新链接才能强制更新UI

要解决此问题，只需将值直接绑定到选定对象即可

<select data-bind="
    options: $root.availableMeals,
    value: meal,
    optionsText: 'mealName',
    optionsCaption: 'Choose...'">
</select>

以下是更新（和工作）的小提琴：

更新： 如果您想使用

mealId

，因为您将从数据库中提取这些值，那么在某个时候您必须进行查找以获取其他值。要么你先付，要么你在存钱

这里是一个更新的小提琴，显示了一种方法，你可以实现这一点

---

我这样做是为了在html的select元素中添加一个“value”属性，这样我就可以检测所选的mealId，例如，它进入数据库中，我可以使用“mealId”作为参考。您仍然可以使用

mealId

，但只需保留该属性即可。不要将整个对象传递给您的预订类。