Заказ выпадающего в алфавитном порядке angular - PullRequest
1 голос
/ 03 марта 2020
            <div class="form-group" *jhiHasAnyAuthority="['ROLE_ADMIN']">
                <label class="form-control-label" jhiTranslate="ManagementApp.project.lab" for="field_leader">Add Lab</label>
                <select class="form-control" id="field_lab" name="lab">
                    <option [ngValue]="null"></option>
                    <option *ngFor="let lab of labs;" (click)="addLab(lab)">{{lab.labCode}}</option>
                </select>
            </div>

Я поддерживаю некоторый код angular с нулевым опытом.

Я пытаюсь создать отсортированный по алфавиту выпадающий список. Я пытался подражать этим значениям выпадающего списка по буквам c порядка angular 6 , но безуспешно.

Я пробовал "let lab of labs| orderBy: 'lab.labCode';"

и "let lab of labs.sort();", поскольку в лабораториях уже есть функция сортировки.

Прототип функции сортировки sort(compareFn?: (a: T, b: T) => number): this; с:

Сортирует массив. * @param compareFn Имя функции, используемой для определения порядка элементов. Если опущено, элементы сортируются в порядке возрастания символов ASCII.

В лаборатории, как вы можете видеть, имеется labCode (строка), который необходимо использовать для сортировки.

Любая помощь будет принята с благодарностью.

---- РЕДАКТИРОВАТЬ --------- Содержимое массива labs: enter image description here

Ответы [ 3 ]

1 голос
/ 03 марта 2020

Ниже код может быть добавлен в компонент ngOnInit () или в вашем успешном вызове API для сортировки по алфавиту

labs.sort ((a, b) => a. labCode.localeCompare (b.labCode));

Надеюсь, это поможет.

0 голосов
/ 03 марта 2020

Вы можете отсортировать ваш массив в ngOnInit()

 sorted : []
 ngOnInit(): void {

    this.sorted = labs.sort((a, b) => a.labCode> b.labCode? 1 : -1);
  }

в вашем html использовании отсортированных наборов из лабораторий

0 голосов
/ 03 марта 2020

В более старых версиях angular нет трубы örderBy. Вы должны написать канал, как указано в примере - https://medium.com/@mohammad.nicoll / sort-pipe-in- angular -6-7-f22475cc4054 и применить то же самое.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...