我一直在使用一个简单的列表,比如learn.knockoutjs.com上的教程,“使用列表和集合”。我希望有一个列表样式的应用程序,用户选择捐赠类型并输入金额,然后将捐款添加到列表中。
本教程通过在单击按钮时添加输入来工作;我正在努力解决如何使用固定输入来连续添加文本值。
假设已经进行了两次捐赠,并且选择以三种捐赠类型1,2和3开始选择,UI将看起来像这样:
Donation Type: [select: Donation 3]
Amount: [text: $100.00]
[button: Add Donation]
Donations:
Type Amount
-------------------------------
Donation 1 $10.00 [remove]
Donation 2 $20.00 [remove]
Total: $30.00
问题:
编辑:
我已经更新了我的问题以提供我的实际用例,并尝试澄清我的问题是什么;我最初使用了learn.knockoutjs.com的列表示例,因为我认为它会更容易,但我认为这只是令人困惑。
答案 0 :(得分:0)
事实上,你非常接近于让它发挥作用。问题是您没有在主视图模型中定义donationAmount
observable属性,这导致KnockoutJS在将此不可用属性绑定到输入标记时失败。
以下是必须更改的代码部分,以便它现在可以正常工作:
function DonationsViewModel() {
var self = this;
self.donationAmount = ko.observable();
// ....
}
这里对您的HTML进行了一些小改动:
<div>
<select data-bind="options: availableDonations, optionsCaption: 'Please select...', value: selectedDonation, optionsText: 'label'"></select>
<input data-bind="value: donationAmount"/>
<button typ="button" data-bind="click: addDonation">Add Donation</button>
</div>
您可以在forked fiddle上看到结果。