Question

我有一组数据，我必须在datalist中显示。我想先加载有限的数据，然后在滚动下降时加载另一个有限的数据。所有这些工作我必须在datalist中完成，即我需要将滚动放在datalist中，然后当滚动到数据列表屏幕的末尾时，更多的数据将来自数组。

我正在使用meteor，所以我需要使用帮助器在客户端返回该数组。我的代码是：

这是我的帮手。这是一个将在html（客户端）返回的数组。

Template.mytemplate.helpers({
  // Here will be helper for displaying data in client side//
  searched_val:function(){
    var a= SessionStore.get("myvalue");
    // console.log(a);
    return a;
  }
  }
});

我的HTML代码是（客户端代码）：

<div class="form-group row ">
            <div class="dropdown col-xs-12">
              <input list="d1" id="search" name="d1" class="form-control input-xs" placeholder="Search by">
                <datalist id="d1" style="overflow-y:auto">
                  {{#each searched_val}}
                <option class="form-control" value="{{this}}"> {{this}} </option>
                 {{/each}}
               </datalist>
            </div>
        </div>

现在，我该怎么办呢。是否有任何jquery，Javascript代码？

我也看过＆＃34; Jquery在滚动上加载更多数据＆＃34;在这里，但它并不适合我，因为它用于整个页面/窗口，但我需要只为datalist和datalist。这是链接＆＃34; jQuery load more data on scroll＆＃34;但它对我没用。

先谢谢

Answer 1

你应该怎么做......

1）首先，您订阅所需集合中的有限数组。

2）只需将<collection>.find()返回给帮助者。

3）然后添加一个滚动事件监听器，通过该监听器，您将检查当前滚动位置是否已达到页面的最后一个限制，然后您将订阅更多项目。

如何从数组中加载datalist中的更多数据

1 个答案: