我想一次只显示一个列表中的 2 个名字,然后点击一个按钮,下一个 2 个名字出现,但有一个错误 [英] I want to show only 2 names at a time from a list and then clicking on a button next 2 names comes up but there is a bug

查看:11
本文介绍了我想一次只显示一个列表中的 2 个名字,然后点击一个按钮,下一个 2 个名字出现,但有一个错误的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我只想显示数组中存在的前 2 个东西,而不是全部,然后通过单击按钮,下一个 2 个名称出现到最后一个,但是我尝试的代码不起作用.我正在给代码请告诉错误.你能帮我更正knoctout js的代码吗.

在 JavaScript 中

EventBE.displayCount = ko.observable(2);EventBE.readMore = function() { EventBE.displayCount(EventBE.displayCount() + 2);};

在 html 中

div class="slide"><button type="button" data-bind"click: EventBE.readMore,visible:EventBE.displayCount() <li ><span data-bind="text:FirstName"></span><span data-bind="text:LastName"></span>,<span data-bind="text:Company"></span><span data-bind="if:EventBE.WhoElseAttends.length <0">没有参加者</span>

解决方案

以下是可用的 HTML:

<button type="button" data-bind="click: readMore, visible: displayCount() < WhoElseAttends().length">阅读更多</button><ul data-bind="foreach: WhoElseAttends.slice(0, displayCount())"><li><span data-bind="text:FirstName"></span><span data-bind="text:LastName"></span>,<span data-bind="text:Company"></span><span data-bind="if: WhoElseAttends.length <0">没有参加者</span>

以及随附的 Knockout 视图模型:

function viewModel() {this.displayCount = ko.observable(2);this.readMore = function() {this.displayCount(this.displayCount() + 2);};this.WhoElseAttends = ko.observableArray([]);for (var i = 0; i <10; i++) {this.WhoElseAttends.push({FirstName : "John", LastName : "Smith", Company : "None"});}}ko.applyBindings(new viewModel());

我还在以下 jfiddle 中呈现了此代码:http://jsfiddle.net/Bg5CF/17/

I want to show only first 2 things which are present in an array instead of all and then b y clicking on button next 2 names comes up till the last, but the code which I am trying is not working. I am giving the code please tell the bug. Can you help me in correcting the code of knoctout js .

In Javascript

EventBE.displayCount = ko.observable(2);
EventBE.readMore = function() { EventBE.displayCount(EventBE.displayCount() + 2); };

in html

div class="slide">
    <button type="button" data-bind"click: EventBE.readMore,visible: 
        EventBE.displayCount() < EventBE.WhoElseAttends.length">Read More</button>
        <ul  data-bind="foreach:EventBE.WhoElseAttends.slice(0, 
             EventBE.displayCount())">
            <li >
                <span data-bind="text:FirstName"></span>
                <span data-bind="text:LastName"></span>,
                <span data-bind="text:Company"></span>
             </li>
        </ul>                  
   <span data-bind="if:EventBE.WhoElseAttends.length <0">No Attendees</span>                    
</div>

解决方案

Here's the working HTML:

<div class="slide">
    <button type="button" data-bind="click: readMore, visible: displayCount() < WhoElseAttends().length">Read More</button>
    <ul data-bind="foreach: WhoElseAttends.slice(0, displayCount())">
        <li>
            <span data-bind="text:FirstName"></span>
            <span data-bind="text:LastName"></span>,
            <span data-bind="text:Company"></span>
        </li>
    </ul>                  
    <span data-bind="if: WhoElseAttends.length <0">No Attendees</span>                    
</div>

And the accompanying Knockout view model:

function viewModel() {
    this.displayCount = ko.observable(2);

    this.readMore = function() {
        this.displayCount(this.displayCount() + 2);
    };

    this.WhoElseAttends = ko.observableArray([]);

    for (var i = 0; i < 10; i++) {
        this.WhoElseAttends.push({FirstName : "John", LastName : "Smith", Company : "None"});
    }
}

ko.applyBindings(new viewModel());

I've also rendered this code in the following jfiddle: http://jsfiddle.net/Bg5CF/17/

这篇关于我想一次只显示一个列表中的 2 个名字,然后点击一个按钮,下一个 2 个名字出现,但有一个错误的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆