使用静态数组时如何在 dx-select-box 上启用分页？答案

【问题标题】：How to enable paging on dx-select-box when using static array?使用静态数组时如何在 dx-select-box 上启用分页？
【发布时间】：2019-12-11 11:46:55
【问题描述】：

我在 AngularJS 中有一个 dx-select-box，它加载一个大约 3k 行的数组，这使得性能非常慢。我想启用分页，但我还没有找到方法。我遵循了文档：

数组数据绑定文档：https://js.devexpress.com/Documentation/Guide/Widgets/SelectBox/Data_Binding/Simple_Array/Array_Only/

在选择框上启用分页：
https://js.devexpress.com/Documentation/Guide/Widgets/SelectBox/Enable_Paging/

但无论如何我都无法将它们两个放在一起并让它们工作。我也试过this solution，但没有成功。

这是 HTML 代码：

<div id="stockShelfs" dx-select-box="vm.stockShelfsOptions"></div>

这是 JS：

this.stockShelfsOptions = {
  valueExpr: 'stockShelfId',
  displayExpr: 'name',
  searchExpr: 'name',
  searchEnabled: true,
  acceptCustomValue: true,
  value: this.product.stockShelfId,
  placeholder: translate('POr_VelgStockShelf'),
  bindingOptions: {
      dataSource: 'vm.stockShelfs',
  },

如果可能的话，有谁知道如何做到这一点？

【问题讨论】：

标签： angularjs drop-down-menu devexpress devextreme

【解决方案1】：

我通过去掉 bindingOptions 配置让它工作了：

dataSource: new DevExpress.data.DataSource({
                store: new DevExpress.data.ArrayStore({
                    data: vm.stockShelfs,
                    key: "stockShelfId",
                    paginate: true,
                    pageSize: 1
                })
            }),

然后在 onCustomItemCreating 函数中进行双向绑定

【讨论】：