2

我需要帮助

我有 2 个选择框，我希望能够更改一个选择值，另一个将被计算和选择

问题是当我从一个选择框中选择一个值并且第二个选择框中不存在计算时，例如，如果我将风险金额设置为 700，则投资金额应为 1400，它不会显示在投资金额选择框中

我想要发生的是将其显示在选择框中，但不将其添加为选项

顺便说一句，选择应该双向工作

请帮忙

http://jsfiddle.net/Z3mCH/

HTML

Invest Amount:
<select style="width:70px;height:22px;" data-bind="options: AvailableInvestAmount, 
                                                    optionsText: function(item) {
                                                        return '$' + item;
                                                    },
                                                    value: InvestAmount"></select>
<span data-bind="text: InvestAmount"></span>

<br />
<br />

Risk Amount:
<select style="width:70px;height:22px;" data-bind="options: AvailableRiskAmount, 
                                                    optionsText: function(item) {
                                                        return '$' + item;
                                                    },
                                                    value: RiskAmount"></select>
<span data-bind="text: RiskAmount"></span>

视图模型

var viewModel = {
    RiskAmount: ko.observable(200)
};

viewModel.AvailableInvestAmount = ko.observableArray(['200', '400', '500', '600', '700', '800', '900', '1000', '1200', '1500', '2000', '3000', '5000']);
viewModel.AvailableRiskAmount = ko.observableArray(['200', '400', '500', '600', '700', '800', '900', '1000', '1200', '1500', '2000', '3000', '5000']);

viewModel.InvestAmount = ko.computed({
    read: function () {
        return this.RiskAmount() * 2;
    },
    write: function (value) {
        this.RiskAmount(value / 2);
    },
    owner: viewModel
});

ko.applyBindings(viewModel);
4

2 回答 2

3

http://jsfiddle.net/vol7ron/RZjPx/

所以看起来它工作正常，但是当它计算时，它试图找到另一个列表中不存在的值（x/2）。因此，您可以看到您的示例适用于其他列表1000中存在的值。500

通常，自动更新两者是一个坏主意 - 它通常会以类似无限循环的状态结束。相反，您可能需要考虑在点击时执行这些计算。查看 [awesome] 教程以创建自定义绑定。

另外，我上面的小提琴显示了应该如何实现 viewModel。虽然您的方法可能有效，但如果您实现更接近文档的教学方式，则更容易遵循。我自己还在学习KO，所以我的立场可能会改变。

于 2013-02-01T02:40:46.453 回答
1

我设法让 i 使用 jquery 工作并绑定一个函数而不是计算绑定

http://jsfiddle.net/abbasmhd/Z3mCH/14/

var viewModel = {
    RiskAmount: ko.observable(200)
};

viewModel.AvailableInvestAmount = ko.observableArray(['200', '200', '400', '500', '600', '700', '800', '900', '1000', '1200', '1500', '2000', '3000', '5000']);
viewModel.AvailableRiskAmount = ko.observableArray(['200', '200', '400', '500', '600', '700', '800', '900', '1000', '1200', '1500', '2000', '3000', '5000']);


viewModel.CalculateInvestAmount = function () {
    var riskAmount = $('#RiskAmount').val();
    var investAmount = riskAmount * 2;
    $('#InvestAmount option:first').val(investAmount).text('$' + investAmount);
    $('#InvestAmount').val(investAmount);

};

viewModel.CalculateRiskAmount = function () {
    var investAmount = $('#InvestAmount').val();
    var riskAmount = investAmount / 2;
    console.log(investAmount);
    console.log(riskAmount);
    $('#RiskAmount option:first').val(riskAmount).text('$' + riskAmount.toFixed(0));
    $('#RiskAmount').val(riskAmount.toFixed(0));
};

ko.applyBindings(viewModel);
于 2013-02-05T01:04:17.113 回答