Question

我使用knockout.js来创建一个gui，使用户可以通过很多不同的主题来过滤他的数据。大多数这些主题由组合框项目表示，这些项目是html中的选择项目。

我使用knockout来订阅所有过滤器选择中的更改。订阅事件只调用一个收集过滤器设置的函数，通过ajax将其发送到服务器并获取满足过滤器的项目列表。

此外，来自服务器的数据还包含每个选择的可用过滤器主题。

我总是想知道启动速度，因为gui完全可用需要一段时间。不久之前，我在数据传递函数中设置了一个断点，看到它在启动时被调用了大约20次，这让我感到非常惊讶。： - （

我该怎样防止这种情况？


var viewModel = {
   entries: ko.observableArray(),           // this is receiving the filtered items

   selectedMode: ko.observable(null),          // Filter 1 initialized to null
   selectedSubMode: ko.observable(null),       // Filter 2 initialized to null
   .
   . 
   availableModes: ko.observableArray(),       // Available filter items 1.
   availableSubModes: ko.observableArray(),    // Available filter items 2.
};

html元素绑定如下：


<select 
    id="selectMode" 
    tabindex="1" 
    data-bind="options: availableModes, 
               value: selectedMode, 
               optionsCaption: 'Any'"
>
</select>

在页面加载时，我发出一个selectedIt的所有选项为“null”的一个Load。因此，返回所有可用数据的第一页，并将availableModes和availableSubModes设置为数据中返回的可用项。

然后开始一种迭代：

第一个选择框将其显示更改为“Any”值，我在绑定中将其设置为optionsCaption。这似乎引发了变革事件。这将再次启动对服务器的请求，并将下一个选择项设置为“任意”。这对所有选择元素重复。

有谁知道如何防止这种情况发生？

我的第一个想法是在加载数据期间禁用敲除更新，并在更新完成后强制更新。但我找不到合适的方法。

感谢任何提示......

Answer 1

如果没有使用订阅方法等查看完整代码，很难确切地说出错误。但是我注意到你提到的一个部分，其中select被设置为“Any”，触发了change事件。我想我可以根据你的描述来解释这一点。

来自KO选项绑定文档。

KO将在项目列表的前面加上一个显示文本的项目 “选择一个项目...”并且值未定义。所以，如果myChosenValue 保持值undefined（默认情况下observables），然后是将选择虚拟选项。

这意味着将selectedMode值设置为null与“Any”的值不匹配。绑定尝试匹配现有值，但不能将selectMode设置为undefined，这会触发更改。

拿这个jsfiddle。您可以看到服务器获取日志语句触发。如果删除selectedMode null赋值，则不会触发日志语句。

http://jsfiddle.net/madcapnmckay/H7jzd/

如果这还没有完全解决问题，那么这个小提琴并包含你的完整订阅设置和一些虚假的ajax声明，我们应该能够让它运转起来。

希望这有帮助

如何在初始化时禁用更新？

1 个答案: