angular2-multiselect:搜索无法进行延迟加载

时间:2019-05-13 12:41:55

标签: angular typescript

我正在关注以下链接: multiselectDropdown

此处提供的演示正在运行,但就我而言,当我评论延迟加载方法搜索时,效果很好,但是如果我启用了它不进行搜索。

这是我的代码HTML

<angular2-multiselect
  [data]="arrDeviceGroups"
  [(ngModel)]="arrSelectedDeviceGroups"
  [settings]="groupSettings"
  (onScrollToEnd)="loadMoreDeviceGroupsList($event)"
  (onSelect)="onGroupSelect($event)">
  <c-item>
    <ng-template let-item="item">
      <label style="color: #333;">{{item.itemName}}</label>
    </ng-template>
  </c-item>
</angular2-multiselect>

.ts文件代码:

this.groupSettings = {
  text: "Select Device groups",
  classes: "myclass custom-class",
  singleSelection: true,
  enableSearchFilter: true,
  lazyLoading: true,
  closeDropDownOnSelection: true,
  searchBy: ['itemName'],
  labelKey: 'itemName'
};

getAllDeviceGroups() {
  this.dialogService.showLoader();
  this.deviceGroupService.getAllDeviceGroups(this.appEngineService.selectedSalesforceId, 1).then(deviceGroupsList => {
    this.parseDeviceGroups(deviceGroupsList['Items']);
    this.deviceGroupsLastEvalutionKey = deviceGroupsList["LastEvaluatedKey"];
    this.dialogService.dismissLoader();
  }, error => {
    console.log(this.LOGTAG, "loadMoreCognitoUser() error :", error);
    this.dialogService.dismissLoader();
    this.dialogService.showErrorToast(error);
  });
}

parseDeviceGroups(deviceGroupList) {
  for (const data of deviceGroupList) {
    this.arrDeviceGroups.push({ id: data['id'], 'name': data['name'], itemName: data['name'], 'devices': data['devices'], 'isGroup': 1 });
  }
}

loadMoreDeviceGroupsList(event: any) {
  if ((event.end === this.arrDeviceGroups.length - 1) && this.deviceGroupsLastEvalutionKey) {
    this.dialogService.showLoader();
    this.deviceGroupService.getAllDeviceGroups(this.appEngineService.selectedSalesforceId, 1, this.deviceGroupsLastEvalutionKey).then(deviceGroupsList => {
      this.parseDeviceGroups(deviceGroupsList['Items']);
      this.deviceGroupsLastEvalutionKey = deviceGroupsList["LastEvaluatedKey"];
      this.dialogService.dismissLoader();
    }, error => {
      console.log(this.LOGTAG, "loadMoreCognitoUser() error :", error);
      this.dialogService.dismissLoader();
      this.dialogService.showErrorToast(error);
    });
  }
}

0 个答案:

没有答案