Javascript 在knockout.js中填充select

我在淘汰表中有一个数量选择选项，但我想根据可用库存设置一个最大限制

假设一个条目有以下值

ID = 1
stock = 8

我想用数字1-stock填充数量字段，在本例中为1-8。数量将始终小于或等于库存

function ItemEntry(ID, stock, quantity) {
    var self = this;
    self.ID= ID;
    self.stock= stock;
    self.quantity = quantity;

}

// viewmodel
function EntryViewModel() {
    var self = this;

    self.itemNumbers = ko.observableArray([
        new ItemEntry("1", 8, QUANTITY HERE!) //initial starting values
    ]);

    self.removeItem = function(item) { self.itemNumbers.remove(item) }
}

//custom binding for dropdown outside of models
ko.bindingHandlers.quantityDropdown = {
        update: function(quantityDropdown, stock, EntryViewModel) {
            var quantity = ko.utils.unwrapObservable(stock());
            for(var i = 0; i < stock(); i++)
            {
               $(quantityDropdown).append('<option value="' + i + '">' + i + '</option>');
            }
        }
    };

ko.applyBindings(new EntryViewModel());

功能项输入（ID、库存、数量）{
var self=这个；
self.ID=ID；
self.stock=股票；
self.quantity=数量；
}
//视图模型
函数EntryViewModel（）{
var self=这个；
self.itemNumber=ko.observableArray([
新条目（“1”，8，此处为数量！）//初始起始值
]);
self.removietem=函数（项）{self.itemNumber.remove（项）}
}
//用于模型外部下拉列表的自定义绑定
ko.bindingHandlers.quantityDropdown={
更新：函数（quantityDropdown、stock、EntryViewModel）{
变量数量=ko.utils.unwrapobbservable（stock（））；
对于（var i=0；i

这是HTML

  <table border="1">
  <thead><tr>
        <th>ID</th><th>Stock</th><th>Quantity</th><th></th>
    </tr></thead>
    <tbody data-bind="foreach: itemNumbers">
        <tr>
            <td data-bind="text: ID"></td>
            <td data-bind="text: stock"></td>
            <td><select data-bind="quantityDropdown: quantity"></select></td>
            <td><a href="#" data-bind="click: $root.removeItem">Remove</a></td>
        </tr>    
    </tbody>
</table>

库存量

在视图模型代码之外创建自定义绑定：

ko.bindingHandlers.quantityDropdown = {

    update: function(element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
        var quantity = ko.utils.unwrapObservable(valueAccessor());
        for(var i = 1; i < quantity + 1; i++)
        {
            // Add each option element to the select here
            $(element).append('<option value="' + i + '">' + i + '</option>');
        }
    }
};

ko.bindingHandlers.quantityDropdown={
更新：函数（元素、valueAccessor、allBindingsAccessor、viewModel、bindingContext）{
var quantity=ko.utils.unwrapobbservable（valueAccessor（））；
对于（变量i=1；i

然后将绑定更改为：

<td><select data-bind="quantityDropdown: stock"></select></td>

在您评论的区域（在循环中），我是否将该值推送到ItemNumber数组中？我不明白你的意思。此外，这是否会出现在viewmodel部分？否，创建一个LI元素并将其添加到传递给方法的元素中。我将使用jQuery更新一个例子来更新答案。对不起，在生病后刚刚回到工作中，大脑还没有跟上速度！忽略李，我的意思是选择！更新了我的答案，现在应该有意义了。：）我在文档中添加了示例代码，使用unwrap从valueAccessor中获取值，而不管它是否是可观察的。看看这是否有效。处理程序引用的是您在数据绑定中传递给它的值，在本例中是ItemNumber中每个对象上的数量。哦，对不起，你想把它绑定到库存而不是数量上吗？