0

基本上，我想要实现的是根据 Knockout.js 中另一个下拉列表的值填充下拉列表

我的视图代码（明显剥离）：

            <div data-bind="with: chosenMailData">
                <table id="tabl-1234" class="mails">
                    <thead><tr><th>Destination</th><th>Hotel</th></tr></thead>
                    <tbody data-bind="template: { name: 'iti-template', foreach: objects, afterRender: $root.myPostProcessingLogic }">
                </table>
            </div>

            <script type="text/html" id="iti-template">
                <tr>
                    <td><select class="desti" data-bind="options: $root.destinations, value: destination.name"></select></td>   
                    <td><select data-bind="options: $root.generall(), value: $root.generall()"></select></td>
                </tr>
            </script>

我的视图模型（再次精简）：

            self.destinations=['Kerela', 'Shoghi, Himachal Pradesh', 'Kasauli, Himachal Pradesh'];

            self.myPostProcessingLogic = function(elements) {
                this.generall = ko.computed(function() {
                    $('.desti').each(function(i, obj) {
                        stayOptions = [];
                            $.getJSON("http://127.0.0.1:8000/api/hotel?format=json&location__name="+obj.value, function(data) {
                                    $.each(data.objects, function(i, item){
                                    stayOptions.push(item.name);
                                    });
                                });
                    });
                    return stayOptions;
                }, this);
            }

插入确实填充了我想要的值alert()的this.generall()节目。stayOptions它正在让该数组显示在酒店列中相应行的选择选项中，这是问题所在。

可能我犯了一个非常愚蠢的错误，但我已经看了很长时间的代码，但什么也没想到。请指教。

编辑：我也在我的视图模型开始时这样做：

            self.generall = ko.observableArray();
4

1 回答 1

2

调用方法时，this变量在调用时被分配。

var f = $root.myPostProcessingLogic;
f(); // this will not set 'this' to '$root'

以上基本上是淘汰赛正在做的事情，这使得this被绑定到里面的其他东西myPostProcessingLogic()。您已经定义了作用域self变量，因此很容易修复。

另一个问题是，重新分配 observables 不会保留任何订阅者，并且任何依赖的 observables 都不会更新。

self.generall = ko.observableArray();
self.myPostProcessingLogic = function(elements) {
    self.generall.removeAll();
    $('.desti').each(function(i, obj) {
        $.getJSON("http://127.0.0.1:8000/api/hotel?format=json&location__name="+obj.value, function(data) {
            $.each(data.objects, function(i, item){
                self.generall.push(item.name);
            });
        });
    });
}
于 2012-12-20T08:27:31.207 回答