javascript - knockout foreach $parent 表示祖 parent 而不是 parent

Question

当遍历 pager.Pages 对象的 foreach 循环时，$data 是 self(正如预期的那样)。但是，$parent 应该是寻呼机对象，但它返回的是 WaterQualityResultViewModel。我做错了什么？

ko.applyBindings(wqrvm, $('#dv_waterReports')[0]);
function WaterQualityResultViewModel() {
    var self = this;
    self.searchItem = new SearchItem();
    self.items = ko.observableArray([]);
    self.pager = new Pager();
    self.search = function() {
        $.ajax({
            url: 'URL GOES HERE',
            dataType: 'json',
            data: {
                'param': 'value'
            },
            async: false,
            success: function(data) {
                if ((data != null) && (data.searchResults !== undefined)) {                 
                    self.items(mappedItems);
                    self.pager.totalItemCount(data.resultsCount);
                    self.pager.lastPage(data.totalPages);
                }
            }
        });
    }
    self.initFromUrl = function() {
        var hash = getHash();
        self.searchItem.geolocation(new geoLocation(0, 0, '', hash));       
        if (hash.currentpage !== 'undefined')
            self.pager.currentPage(hash.currentpage);
        if (hash.pagesize !== 'undefined')
            self.pager.pageSize(hash.pagesize);
    };
    self.initialize = function() {
        if (window.location.hash) {
            self.initFromUrl();
            self.search();
        }
    };
    self.initialize();
}

function Pager() {
    var self = this;
    self.lastPage = ko.observable(1);
    self.totalItemCount = ko.observable(0);
    self.currentPage = ko.observable(1);
    self.pageSize = ko.observable(10);
    self.pageSlide = 2;
    self.HasNextPage = ko.computed(function () {
        return self.currentPage() < self.lastPage();
    });
    self.HasPrevPage = ko.computed(function () {
        return self.currentPage() > 1;
    });
    self.FirstItemIndex = ko.computed(function () {
        return self.pageSize() * (self.currentPage() - 1) + 1;
    });
    self.LastItemIndex = ko.computed(function () {
        return Math.min(self.FirstItemIndex() + self.pageSize() - 1, self.totalItemCount());
    });
    self.Pages = ko.computed(function () {
        //debugger;
        var pageCount = self.lastPage();
        var pageFrom = Math.max(1, self.currentPage() - self.pageSlide);
        var pageTo = Math.min(pageCount, self.currentPage() + self.pageSlide);
        pageFrom = Math.max(1, Math.min(pageTo - 2 * self.pageSlide, pageFrom));
        pageTo = Math.min(pageCount, Math.max(pageFrom + 2 * self.pageSlide, pageTo));

        var result = [];
        for (var i = pageFrom; i <= pageTo; i++) {
            result.push(i);
        }
        return result;
    });
    self.buildUrl = function () {
        var locHash = encodeQueryData({
            'currentpage': self.currentPage(),
            'pagesize': self.pageSize()
        });
        return locHash;
    };
}

以下模板返回:

<!-- ko foreach:pager.Pages -->
            <pre data-bind="text: 'pager is ' + JSON.stringify(ko.toJS($data))"></pre>
            <pre data-bind="text: 'parent is: ' + JSON.stringify(ko.toJS($parent))"></pre>
<!-- /ko -->

Answer 1

$parent should be the pager object

您基于什么做出此假设？ OP 中不清楚，因为您尚未发布完整的 HTML。

自从你打电话 applyBindings(新的 WaterQualityResultViewModel())； View 模型是 $parent。

也许您认为 $parent 应该引用 pager，因为您是数据绑定(bind)的 foreach:pager.Pages。这个假设是不正确的。 Knockout 知道您提供给它的 DOM 绑定(bind)上下文；它不知道您的 Javascript 对象结构。

$parent 指的是 viewModel 本身，$data 指的是 Pages 数组中的每个值是绝对正确的。