我有可观察的数组绑定到UI上的html字段。使用阵列里面的基因敲除可观察
但是,UI上这些字段的更改没有反映在视图模型中,因为按照Knockout文档,observableArray会跟踪数组中的哪些对象,而不是这些对象的状态。
代码看起来如下:
var RewardMissionModel = function() {
var self = this;
self.achievementID = ko.observable();
self.rewardAsset = ko.observable();
self.rewards = ko.observableArray([new Reward("Points", "Qty", "", "Item", "")]);
self.isDirty = false;
//Add reward
self.addReward = function() {
//var self = this;
var tempRewardType = "Points";
self.rewards.push(new Reward(tempRewardType, "Qty", "", "Item", "", 0));
};
//Remove reward
self.removeReward = function (reward) {
if (self.rewards().length > 1)
self.rewards.remove(reward);
};
//------------------------------------------------------------------------------
};
function Reward(rewardType, quantityLabel, rewardQuantity, itemLabel, item, itemID) {
var self = this;
//self.viewModel = viewModel;
self.rewardTypes = ["Points", "Coins", "Items"];
self.rewardType = ko.observable(rewardType);
self.itemLabel = ko.observable(itemLabel);
self.itemText = ko.observable(item);
self.quantityLabel = ko.observable(quantityLabel);
self.rewardQuantity = ko.observable(rewardQuantity);
this.selectedRewardType = ko.observable(rewardType);
self.isItemType = function (selectedRewardType) {
return selectedRewardType === this.selectedRewardType();
}
self.itemID = ko.observable(itemID);
}
HTML代码:
<div data-bind="template: { name: 'rewards-template', foreach: rewards }"></div>
<script type="text/html" id="rewards-template">
<span style="margin-left:30px">Reward Type</span>
<select class="dropdown" data-bind="options: rewardTypes, value: selectedRewardType"></select>
<span data-bind="text: itemLabel, visible: isItemType('Items')"></span>
当添加或移除对象到可观察到的阵列的视图模型脏标志置位,但是当我修改上它不被考虑。
其中一种方法可能是将普通数组放入可观察对象中。
是否有任何代码示例来说明这个或任何更好的方法?
请帮忙。
我实施类似于这里提到的方法,但它不能正常工作。我用代码块更新了我的问题 – Prasad