简单值绑定到选择标记

Simple value bind to select tag

本文关键字:选择 绑定 简单      更新时间:2023-09-26

请原谅我的菜鸟,我不会要求你为我创建一个软件解决方案,但我只是想快速上课(或修复我的代码)关于如何让我的淘汰.js工作。 你看,我是 JS 的新手,我正试图在这里弄清楚一些事情:

<p>Show the number here: <span data-bind="text: showVal()" id="curr-value"></span>
                <select data-bind="selectedOptions:selectedBlah, options: $root.numberSet, value: currVal, optionsText: 'numName'">
                </select>
            </p>
            <script type="text/javascript">
              function NumbersSViewModel() {
                self.numberSet = [
                  { numName: "Two in Decimal is", currVal: 2 },
                  { numName: "Three in Decimal is", currVal: 3 },
                  { numName: "Four in Decimal is", currVal: 4 },
                ]
                self.selectedBlah = ko.observableArray([]);
                self.showVal = ko.computed(function() {
                    var value = currVal().toString();
                    return value;
                });
              }
              ko.applyBindings(new NumberSViewModel()); </script>

所以,我要做的是,如果你在一个值上设置下拉菜单,那么范围上的文本值就会改变。我确信这是可能的,我只是无法工作。

Javascript:

function NumbersViewModel() {
    var self = this;
    self.numberSet = [
        { numName: "Two in Decimal is", curVal: 2 },
        { numName: "Three in Decimal is", curVal: 3 },
        { numName: "Four in Decimal is", curVal: 4 },
    ];
    self.selectedNumber = ko.observable();
    }
ko.applyBindings(new NumbersViewModel()); 

.HTML:

<select data-bind="options: numberSet,
                   optionsText: 'numName',
                   optionsValue: 'curVal',
                   value: selectedNumber"></select>
Show the number here:
<span data-bind="text: selectedNumber" id="curr-value"></span>

见小提琴