3

对于这段代码

function Order(name, initialMeal) {
    var self = this;
    self.name = name;
    self.meal = ko.observable(initialMeal);
}

function OrdersViewModel() {
    var self = this;
    self.availableMeals = [
        { menuItem:"Chicken", calories:1000, price:12 },
        { menuItem:"Eggs", calories:900, price:10 },
        { menuItem:"Fries",calories:700, price:15 }
    ];

    self.orders = ko.observableArray([
        new Order("Mike", self.availableMeals[0]),
        new Order("John", self.availableMeals[0]),
        new Order("Larry", self.availableMeals[0])
    ]);
    self.addOrder = function(){
        self.orders.push(new Order("", self.availableMeals[0]));
    }
}
ko.applyBindings(new OrdersViewModel());

我有以下观点

 <tbody data-bind="foreach: orders">
        <tr>
            <td><input data-bind="value: name" /></td>
            <td><select data-bind="options: $root.availableMeals, value: meal, optionsValue: 'price', optionsText: 'menuItem'"></select></td>
            <td data-bind="text: meal().price"></td>
        </tr>
    </tbody>

您可能可以在淘汰赛示例中找到它。问题是最后一个绑定餐()。当 optionsValue 存在于它之上时,价格似乎不起作用。如果我删除 optionsValue 它工作得很好。我错过了什么吗?谢谢。

4

1 回答 1

1

是的,你错过了一些东西。

如果不指定,则将一个对象(来自数组)optionsValue绑定到订单的属性。绑定查找您绑定的属性,并找到它,因为它找到了这个对象:mealavailableMealsmealpricepricemeal

{ menuItem:"Eggs", calories:900, price:10 }

这行得通。

当您指定optionsValueasprice时,您将一个数字绑定到meal订单的属性。price绑定会查找该号码上不存在的属性price

这都是正确的行为。你应该只optionsValue在你真正需要你指定的属性时使用。这通常只有在您想要绑定到ID已绑定到下拉列表的某个列表时才需要,例如您可能从数据库中获取的列表。由于您在绑定到的对象上使用其他属性(价格),因此最好让它绑定整个对象,以便以后可以使用整个对象。

于 2012-11-08T23:43:59.397 回答