Question

我有一个可以在javascript中映射到select的knockout observable。根据选择值，它具有div的“with”绑定。

我需要在javascript中设置observable的值，问题是div从不显示。以下是详细信息：

observable绑定到UI中的select，所选值是一个对象：

 <select data-bind="options: Offers, 
                    optionsText: 'Offer', 
                    optionsCaption: 'Please Choose', 
                    value: SelectedOffer">
 </select>

当用户选择一个值时，我使用“with”绑定div数据，该数据显示在select：

下

<div data-bind="with: SelectedOffer">
     ....
</div>

现在，当我在UI中选择一个值时，这完全正常。

当用户选中一个方框时，我在javascript中设置了observable值，这也有效：

event.SelectedOffer(myOffer);

我可以看到我在选择中设置的优惠。问题是使用“with”的div绑定从不显示。如果我从选择中手动选择一些东西，那么它再次正常工作。

我尝试了很多不同的东西以某种方式让ko知道价值已经改变了，它需要向我展示div，但似乎没有任何效果。我用过

valueHasMutated
valueWillMutate
ko.utils.triggerEvent
$(myselect).change()

帮助！

Answer 1

听起来你和KO混淆了一些事情

select元素上的value:将自动在ViewModel上设置SelectedOffer observable。没有必要手动设置它，这是我认为您使用 event.SelectedOffer(myOffer); 所做的理解。

如果您只想在用户选中某些内容时更新SelectedOffer，则需要将选择框上的值绑定到不同的observable，然后手动更新“真实”值

我已设置http://jsfiddle.net/HLGKf/来演示如何设置简单的ViewModel和选择框，以及使用 with: 绑定

Answer 2

好的，这是固定的！感谢您的回复，esp nemesv的评论和设置jsfiddle。

http://jsfiddle.net/ww9dK/14/

var ViewModel = function()  {
var self = this;
   self.list1 = [{Offer: "Offer1"},{Offer: "Offer2"},{Offer: "Offer3"}];
   self.list2 = [{Offer: "Offer4"},{Offer: "Offer5"},{Offer: "Offer6"}];

   self.AlternateList = ko.observable(false);
   self.SelectedOffer = ko.observable();
   self.SelectedList = ko.observable(self.list1);

   self.selectSecond = function() {

     self.SelectedList(!self.AlternateList() ? self.list2: self.list1);
     self.SelectedOffer(!self.AlternateList() ? self.list2[0]: self.list1[0]);
   }
};

底线是我的备用列表需要是一个可观察的。得益于一个很棒的同事的帮助。 ko.applyBindings（new ViewModel（））;

淘汰更新可观察不适用于

2 个答案: