使用淘汰赛根据下拉列表中选定的值隐藏/显示问题

好吧，我是一个淘汰赛菜鸟。很难解决一个非常简单的问题。我有一个与淘汰的 observableArray 相关的下拉列表。还有一个与另一个 observableArray 相关的问题列表。问题应根据下拉列表的选定值隐藏/显示。

在查看小提琴之前，请阅读以下内容。
我对“EnvId() === 1”进行了硬编码，只是为了使其工作。我已经尝试了各种函数和 ko.compulated （在“问题”和“viewModel”中）将“1”替换为“CurrentEnviron()”之类的东西，但已将它们从小提琴中删除，因为我不想要影响任何人的答案。好的，这是fiddle.

我发现了很多其他问题REALLY很接近，但又足够不同，以至于我无法使用答案。抱歉，如果确实有重复项，我只是使用了错误的搜索词而找不到它。

为了能够使用该选项绑定，您需要确保还应用了value绑定到它来标记哪个项目被选中。然后你可以使questionsarray 一个计算的可观察量，将根据所选值返回一组经过过滤的问题。

Environment Type: <select id="qEnv" data-bind="value: selectedEnvironment, options: envTypes, optionsCaption: 'Select...', optionsValue: 'envId', optionsText: 'envName'"></select>

还要确保使用您创建的映射数组初始化可观察数组。大学教师 不要像你那样更换它们。 （尽管在本例中这并不重要，因为数组没有被修改）

function viewModel() {
    var self = this;

    // initialize the array with the mapped array
    self.envTypes = ko.observableArray(ko.utils.arrayMap(environments, function(item) {
        return {
            envName: item.Text,
            envId: item.EnvId
        };
    }));

    // this tracks our selected environment value
    self.selectedEnvironment = ko.observable();

    // return a filtered array where the items match the selected environment
    self.questions = ko.computed(function () {
        return ko.utils.arrayFilter(quests, function (item) {
            return item.EnvId == self.selectedEnvironment();
        });
    });
}

您可能希望根据问题数组是否为空来显示问题或消息，因此您必须调整测试。

data-bind="if: questions().length"

环境有重复EnvId值，所以我更新了这些值并添加了optionsCaption绑定以增加效果。

更新了小提琴