knockout js - 如何在下拉列表上进行条件绑定

Question

我有一个由各种 Mvc 操作填充的 Knockout 视图模型。

1. 从第一个下拉列表中选择类别（例如水果、肉类、饮料等）。

2. 第二个下拉列表会根据第一个选项自动填充。但是，可能有 2 个水果匹配项（例如苹果、橙子），2 个肉类匹配项（例如牛肉、羊肉）以及许多饮料选择（数百个）。

3. 我的页面当前根据所选类别显示搜索框。

我想知道如何自动绑定 Fruit & 的第二个下拉菜单肉，或者等待并根据搜索查询的结果进行绑定。

抱歉，这很模糊 - 焦躁的客户！对于 KnockoutJ 来说非常陌生。

提前致谢。

Answer 1

如果我理解正确，您可以在视图模型中创建一个方法，将其绑定到下拉列表的更改事件。

示例方法：

var myViewModel = {
    firstDropDownArray: ko.observableArray([]),
    secondDropDownArray: ko.observableArray([]),

    // Validates Selection
    validateSelection: function (item) {
        var anotherList;

        switch (item.toUpperCase()) {
            case "FRUIT":
                // Do something...
                break;
            case "DRINKS":
                // Do something else...
                break;
            default:
        }
    }
};

您的下拉菜单可以绑定到这样的方法：

<select id="FirstDropDown" data-bind="options: myViewModel.firstDropDownArray, <any other binding options>, event: {change: myViewModel.validateSelection(currentItem)}">
</select>

如下所述：事件绑定,

当调用你的处理程序时，Knockout 将提供当前模型
value 作为第一个参数。

我假设这意味着当您调用该方法时 currentItem 将成为所选项目。
我知道在我的示例代码中我编写了 item.toUpperCase() 但这只是假设该项目作为字符串传递。显然，这种语法必须根据您声明和填充下拉列表的方式进行更改，但本质上您仍然应该能够在视图模型中编写一个方法，然后可以绑定到更改事件，或者您喜欢的任何其他事件。