与optionsValue和观察到的阵列

淘汰赛发出这段代码与optionsValue和观察到的阵列

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它工作得很好。我错过了什么吗？谢谢。

来源

2012-11-08 Vidi

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

没有指定optionsValue，您正在绑定一个meal对象（从availableMeals数组）到订单的meal属性。该price结合的外观上，你绑定的meal的price属性，它发现它，因为它发现这个对象：

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

这工作。

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

这是所有正确的行为。当您实际需要您指定的财产时，您应该只使用optionsValue。这通常只在您想绑定到您绑定到下拉列表的某个列表的ID时才有必要，就像您可能从数据库中获得的列表一样。由于您正在绑定的对象上使用其他属性（价格），因此最好通过让它绑定整个对象以便稍后使用整个对象来提供服务。

来源

2012-11-08 23:43:59 Tyrsius

与optionsValue和观察到的阵列

回答

相关问题