淘汰赛数组中的 if 语句答案

【问题标题】：if statement inside knockout array淘汰赛数组中的 if 语句
【发布时间】：2013-06-11 16:16:26
【问题描述】：

我正在尝试使用计数变量一次加载 25 个项目的淘汰赛可观察数组。这个想法是，当您单击一个按钮时，您会在列表中获得另外 25 个项目。听起来很简单，但我对淘汰赛毫无用处。

我尝试调用 $root.getCount 和 $parent.getCount 并将 getCount 作为值放在我的列表视图 div 中，但没有任何效果。我可能想多了。我要做的就是将一个命名变量放入 $getCount 所在的 if 语句中。帮助会很棒。

<div class="list-view" >
    <ul data-bind="foreach: myBigList" class="shop_list">
        <!-- ko if: $index() < $getCount -->
            <li class="list_row">

            </li>
        <!-- /ko -->
    </ul>
</div>

这是我的视图模型

 $(function () {
    var viewModel = {
        count: ko.observable(25),
        getCount: function () {
            return count;
        },
        updateCount: function () {
            count+=count;
        },
    };
    ko.applyBindings(viewModel);
})

【问题讨论】：

您想从服务器加载接下来的 25 个项目吗？或者您已经加载了所有项目，您只需要显示 25、50 等？
我已经加载了这些项目。没错，就是想显示接下来的 25、50 等

标签： if-statement for-loop knockout.js

【解决方案1】：

我不确定我是否理解您真正想要实现的目标，但我会假设您已经有了一个要以 25 组为一组显示的项目列表。您可以使用 @ 来实现987654321@绑定：

<div class="list-view" >
    <ul data-bind="foreach: myBigList" class="shop_list">
        <li class="list_row" data-bind="visible: $index() < $parent.count()">

        </li>
    </ul>
</div>

由于 count 是可观察的，要更新它的值，您需要这样做：

$(function () {
    function ViewModel() {
        this.count = ko.observable(25);
        this.updateCount = function () {
            var newCount = this.count() + 25;
            this.count(newCount);
        };
    }
    ko.applyBindings(new ViewModel());
})

【讨论】：

【解决方案2】：

由于count 是一个可观察对象，您必须使用函数语法来返回它：return count();。如果您想在每次调用updateCount 方法时将 25 加到 count 变量中，则需要对该值进行硬编码。

$(function () {
    var viewModel = {
        count: ko.observable(25),
        getCount: function () {
            return count();
        },
        updateCount: function () {
            count()+=25;
        },
    };
    ko.applyBindings(viewModel);
})

【讨论】：