Настройка текста на вкладке angular множественный выбор - PullRequest
0 голосов
/ 30 апреля 2020

Я использую angular 2 мультиселект. Когда пользователь щелкает его, API вызывается в фоновом режиме и отображает параметры в раскрывающемся списке. Но поскольку API тратит время, чтобы дать ответ, раскрывающийся список отображается как «Нет доступных данных», а затем показывает ответ, когда он получен. Как изменить текст по умолчанию на что-то вроде «Загрузка ...»?

Ответы [ 2 ]

1 голос
/ 30 апреля 2020

Заменить «Нет данных» на «Загрузка ...» в качестве текста по умолчанию. Когда API вызывается и получает ответ, возможно, вы переопределяете параметры раскрывающегося списка ответом, который заменит «Загрузка ...». И если API получает ответ 0, то вы должны заменить на «Нет данных».

Если вы показываете «Нет данных» перед простым вызовом API, то это означает, что вы говорите пользователю, что в раскрывающемся списке нет никакого значения, но это приносит ценность позже. Этим вы даете неверное представление о выпадающем меню, которое не соответствует UX, что вам нужно, если вы согласны.

Ниже решение - это взлом, может быть, вы захотите переписать согласно требованию, потому что я при условии, что ваш код выглядит примерно так, как показано ниже, но я использовал вместе с решением:

html:

<ng-multiselect-dropdown
  [placeholder]="text"
  [data]="dropdownList"
  [(ngModel)]="selectedItems"
  [settings]="dropdownSettings"
  (onSelect)="onItemSelect($event)"
>
</ng-multiselect-dropdown>

ts:

//Declare settings

this.dropdownSettings = {
      singleSelection: false,
      idField: 'id',
      textField: 'text',
      selectAllText: 'Select All',
      unSelectAllText: 'UnSelect All',
      noDataAvailablePlaceholderText: "Loading...",
      itemsShowLimit: 3,
      allowSearchFilter: true,
      limitSelection: 2
    };
  }
onClick(){
  // then api call here will replace the string most probably
}
0 голосов
/ 30 апреля 2020

Было раскрывающееся свойство настройки с именем "noDataLabel", которое и помогло. Его значение используется, когда данные недоступны.

...