Question

我有一个视图模型（计费），我从第二个视图模型（摘要）引用。

具体来说，我有一个显示国家的组合框。绑定有效，但在摘要视图模型视图中，它获取国家/地区的代码（即＆＃34; AO＆＃34;），而我想显示名称（＆＃34;安哥拉＆＃34;）。 / p>

我可以在结算vm上创建一个ko.computed属性来获取国家名称，但除了创建这个额外的功能之外还有其他方法吗？

结算视图模型

function Billing() {
    var self = this;

    var countries = [
      { name: 'Afghanistan', code: 'AF' },
      { name: 'Åland Islands', code: 'AX' },
      { name: 'Albania', code: 'AL' },
      { name: 'Algeria', code: 'DZ' },
      { name: 'American Samoa', code: 'AS' },
      { name: 'Andorra', code: 'AD' },
      { name: 'Angola', code: 'AO' }
      ];

    self.country = ko.observable('AO');
    };

结算视图

<select id="country" class="col-md-4 form-control" data-bind="options: countriesList, optionsText: 'name', optionsValue: 'code', value: country, attr: { placeholder: 'Country' }"></select>

摘要视图模型

function (ko) {
    function Summary(configurationVm, billingVm) {
        var self = this;        
        self.configurationVm = ko.observable(configurationVm);
        self.billingVm = ko.observable(billingVm);
        console.log("two types: %o, %o", self.configurationVm, self.billingVm);
     };

    return (Summary);
});

摘要视图（剪切到相关国家/地区部分）

<!-- ko with: billingVm -->
<span data-bind="text: country"></span>
<!-- /ko -->

Answer 1

删除optionsValue：＆＃39;代码＆＃39;。这样，价值就是国家本身，而不仅仅是代码。然后，您可以使用country.name获取名称，使用country.code获取代码：

<select id="country" class="col-md-4 form-control" data-bind="options: countriesList, optionsText: 'name', value: country, attr: { placeholder: 'Country' }"></select>
<!-- ko with: country -->
<span data-bind="text: name"></span>
<!-- /ko -->

http://jsfiddle.net/Wk7dr/13/

列表中的文本绑定查找值

1 个答案: