时间戳

首页 > 解决方案 > KnockoutJS 获取 Select 的文本和值

knockout.js - KnockoutJS 获取 Select 的文本和值

问题描述

我有这行代码用于选择：

<select data-bind="options: $root.Countries, optionsText: 'Text', optionsValue: 'Value',  value: $root.SelectedDialogCountry, optionsCaption: 'All'"></select>

我可以得到用“值”选择的值，但我也想得到“文本”

示例： 文本：美国 值：美国

有没有办法让我得到“美利坚合众国”？

标签： knockout.js

解决方案

您可以从绑定中删除该optionsValue: 'Value'属性。这会将整个Country对象设置为SelectedDialogCountryobservable 中的值。（文档）

这是一个工作片段。

function viewModel() {
  const self = this;
  self.Countries = ko.observableArray([
    { Text: "United States of America", Value: "USA" },
    { Text: "China", Value: "CHN" },
    { Text: "India", Value: "IND" }]);
    
  self.SelectedDialogCountry = ko.observable();
  
  self.SelectedDialogCountry.subscribe(_ => {
    console.log(self.SelectedDialogCountry().Text)
    console.log(self.SelectedDialogCountry().Value)
  })
};

ko.applyBindings(new viewModel)
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>
<select data-bind="options: Countries,
                       optionsText: 'Text',
                       value: SelectedDialogCountry,
                       optionsCaption: 'Select'"></select>

推荐阅读