Question

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

我尝试调用$ root.getCount和$ parent.getCount并将getCount放在我的list-view 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);
})

Answer 1

我不确定我是否理解你真正想要达到的目标，但我会假设你已经拥有了一个很大的项目列表，你希望以25个为一组显示。你可以使用{ {3}}绑定：

<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());
})

Answer 2

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

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

如果语句在knockout数组中

2 个答案: