Question

这是一个有点棘手的问题。基本上我一直在尝试基于KnockoutJS网站（http://knockoutjs.com/examples/cartEditor.html）中的一个示例在KnockoutJS中构建购物车页面。但是我想使用jQueryUI滑块，以便我可以调整购物车中每个产品的值。

这我已经设法工作了，我可以在我的购物篮中添加一个产品（在这种情况下是Motorcars）并调整价值，并根据汽车是否有运动套件增加/减少价值转换。

http://jsfiddle.net/FloatLeft/UjRrJ/

然而，我没有添加产品（“添加汽车”按钮）然后选择汽车类型，而是希望能够通过点击按钮将特定类型（例如宝马，福特）添加到购物车（例如，单击“添加BMW”按钮 - 此时此功能无效。）

然而，我的简单大脑无法解决如何将按钮绑定到集合中的特定汽车。我想我可以通过创建一个迭代集合的函数来检索汽车，并找到具有与字符串匹配的类型的汽车，例如。

    function GetCar(carType) {
        for (var i = 0; i < sampleCars.length; i++) {
            if (sampleCars[i].Type == carType) {
                return sampleCars[i];
            }
        }
    }

所以基本上我想知道如何将“添加宝马”按钮的点击事件绑定到集合中的特定汽车并将其添加到我的购物车中。

Answer 1

如果您打算制作多个按钮，可以创建一个可以创建可以接收汽车类型的事件处理程序的功能。

self.addSpecificCarLine = function (carType) {
    return function () {
        var car = ko.utils.arrayFirst(sampleCars, function (car) {
            return car.Type === carType;
        });
        var cartLine = new CartLine();
        cartLine.car(car);
        self.lines.push(cartLine);
    };
};

然后你可以像这样绑定处理程序：

<button data-bind='click: addSpecificCarLine("BMW")'>Add BMW</button>

Updated fiddle

KnockOut JS - 将按钮绑定到集合中的项目

1 个答案: