未捕获的ReferenceError:无法处理绑定" visible:function(){return NeedPaging}"消息:未定义NeedPaging

时间:2017-12-28 19:33:25

标签: javascript knockout.js

未捕获的ReferenceError:无法处理绑定" visible:function(){return NeedPaging}" 消息:未定义NeedPaging     at visible(eval at parseBindingsString(knockout-3.4.2.js:68),:3:60)     在更新(knockout-3.4.2.js:104)     在function.a.B.i(knockout-3.4.2.js:73)     在Function.Uc(knockout-3.4.2.js:52)     在Function.Vc(knockout-3.4.2.js:51)     在Function.U(knockout-3.4.2.js:51)     在Object.a.m.a.B(knockout-3.4.2.js:49)     在击倒-3.4.2.js:73     at Object.r(knockout-3.4.2.js:11)     在m(knockout-3.4.2.js:72)

我得到了任何帮助,非常感谢你提前。 我只是在生产中遇到这个错误,但在我当地它工作得很好我不知道我错过了什么。看起来评论正在删除,这给了我错误。

$(function () {
"use strict";   

var PagingVm = function (options) {
    var self = this;
    self.PageSize = ko.observable(options.pageSize);
    self.CurrentPage = ko.observable(1);
    self.TotalCount = ko.observable(options.totalCount);
    self.PageCount = ko.pureComputed(function () {
        return Math.ceil(self.TotalCount() / self.PageSize());
    });

    self.SetCurrentPage = function (page) {
        if (page < self.FirstPage)
            page = self.FirstPage;

        if (page > self.LastPage())
            page = self.LastPage();

        self.CurrentPage(page);
    };

    self.FirstPage = 1;
    self.LastPage = ko.pureComputed(function () {
        return self.PageCount();
    });

    self.NextPage = ko.pureComputed(function () {
        var next = self.CurrentPage() + 1;
        if (next > self.LastPage())
            return null;
        return next;
    });

    self.PreviousPage = ko.pureComputed(function () {
        var previous = self.CurrentPage() - 1;
        if (previous < self.FirstPage)
            return null;
        return previous;
    });

    self.NeedPaging = ko.pureComputed(function () {
        return self.PageCount() > 1;
    });

    self.NextPageActive = ko.pureComputed(function () {
        return self.NextPage() != null;
    });

    self.PreviousPageActive = ko.pureComputed(function () {
        return self.PreviousPage() != null;
    });

    self.LastPageActive = ko.pureComputed(function () {
        return (self.LastPage() !== self.CurrentPage());
    });

    self.FirstPageActive = ko.pureComputed(function () {
        return (self.FirstPage !== self.CurrentPage());
    });

    // this should be odd number always
    var maxPageCount = 7;

    self.generateAllPages = function () {
        var pages = [];
        for (var i = self.FirstPage; i <= self.LastPage(); i++)
            pages.push(i);

        return pages;
    };

    self.generateMaxPage = function () {
        var current = self.CurrentPage();
        var pageCount = self.PageCount();
        var first = self.FirstPage;

        var upperLimit = current + parseInt((maxPageCount - 1) / 2);
        var downLimit = current - parseInt((maxPageCount - 1) / 2);

        while (upperLimit > pageCount) {
            upperLimit--;
            if (downLimit > first)
                downLimit--;
        }

        while (downLimit < first) {
            downLimit++;
            if (upperLimit < pageCount)
                upperLimit++;
        }

        var pages = [];
        for (var i = downLimit; i <= upperLimit; i++) {
            pages.push(i);
        }
        return pages;
    };

    self.GetPages = ko.pureComputed(function () {
        self.CurrentPage();
        self.TotalCount();

        if (self.PageCount() <= maxPageCount) {
            return ko.observableArray(self.generateAllPages());
        } else {
            return ko.observableArray(self.generateMaxPage());
        }
    });

    self.Update = function (e) {
        self.TotalCount(e.TotalCount);
        self.PageSize(e.PageSize);
        self.SetCurrentPage(e.CurrentPage);
    };

    self.GoToPage = function (page) {
        if (page >= self.FirstPage && page <= self.LastPage())
            self.SetCurrentPage(page);
    }

    self.GoToFirst = function () {
        self.SetCurrentPage(self.FirstPage);
    };

    self.GoToPrevious = function () {
        var previous = self.PreviousPage();
        if (previous != null)
            self.SetCurrentPage(previous);
    };

    self.GoToNext = function () {
        var next = self.NextPage();
        if (next != null)
            self.SetCurrentPage(next);
    };

    self.GoToLast = function () {
        self.SetCurrentPage(self.LastPage());
    };
}

var MainViewModel = function () {
    var self = this;       
    self.PageSize = ko.observable(10);
    self.AllData = ko.observableArray();
    self.PagaData = ko.observableArray();
    self.ActivePaging = ko.observable(false);       
    self.Paging = ko.observable(new PagingVm({
        pageSize: self.PageSize(),
        totalCount: self.AllData.length
    }));

    self.DeSelect = function (mainModel, event) {
        if (event.target.value === self.SelectedSearchOption()) {
            self.SelectedSearchOption(null);
            event.target.checked = false;
        }
        return true;
    };

    self.pageSizeSubscription = self.PageSize.subscribe(function (newPageSize) {
        self.Paging().Update({
            PageSize: newPageSize,
            TotalCount: self.AllData().length,
            CurrentPage: self.Paging().CurrentPage()
        });
        self.RenderAgain();
    });

    self.currentPageSubscription = self.Paging().CurrentPage.subscribe(function () {
        self.RenderAgain();
    });

    self.RenderAgain = function () {
        var result = [];
        var startIndex = (self.Paging().CurrentPage() - 1) * self.Paging().PageSize();
        var endIndex = self.Paging().CurrentPage() * self.Paging().PageSize();

        for (var i = startIndex; i < endIndex; i++) {
            if (i < self.AllData().length)
                result.push(self.AllData()[i]);
        }
        self.PagaData(result);
    }

    self.dispose = function () {
        self.currentPageSubscription.dispose();
        self.pageSizeSubscription.dispose();
    }   
}

var vm = new MainViewModel();
ko.applyBindings(vm);
vm.RenderAgain();

});

<div data-bind="visible: ActivePaging" class="row" style="display: none;">
    <div class="container-fluid">
        <div class="row">
            <div class="col-sm-3 form-group">
                <label>page size</label>
                <input class="form-control" type="number" min="1" data-bind="textInput:PageSize" />
            </div>
            <div class="col-sm-6">
                <div class="form-group marg-top-reports">
                    <!-- ko with:Paging()-->
                    <ul data-bind="visible: NeedPaging" class="pull-left pagination">
                        <li data-bind="css: { disabled: !FirstPageActive() }">
                            <a data-bind="click: GoToFirst">First</a>
                        </li>
                        <li data-bind="css: { disabled: !PreviousPageActive() }">
                            <a data-bind="click: GoToPrevious">Previous</a>
                        </li>
                        <!-- ko foreach: GetPages() -->
                        <li data-bind="css: { active: $parent.CurrentPage() === $data }">
                            <a data-bind="click: $parent.GoToPage, text: $data"></a>
                        </li>
                        <!-- /ko -->
                        <li data-bind="css: { disabled: !NextPageActive() }">
                            <a data-bind="click: GoToNext">Next</a>
                        </li>
                        <li data-bind="css: { disabled: !LastPageActive() }">
                            <a data-bind="click: GoToLast">Last</a>
                        </li>
                    </ul>
                    <!-- /ko -->
                </div>
            </div>
        </div>            
</div>

0 个答案:

没有答案