Улучшить документацию Просмотреть исходный код orderBy
- Фильтр в модуле ng
Обзор
Возвращает массив, содержащий элементы из указанного collection, отсортированные функцией comparator на основе значений, вычисленных с помощью предиката expression.
Например, [{id: 'foo'}, {id: 'bar'}] | orderBy:'id' приведет к [{id: 'bar'}, {id: 'foo'}].
collection может быть массивом или объектом, похожим на массив (например, NodeList, объект jQuery, TypedArray, строка и т. д.).
expression может быть единственным предикатом или списком предикатов, каждый из которых служит для разбора ничьих в предыдущем. expression вычисляется для каждого элемента, а результат используется для сравнения с другими элементами.
Вы можете изменить порядок сортировки, установив reverse в true. По умолчанию элементы сортируются по возрастанию.
Сравнение выполняется с помощью функции comparator. Если она не указана, используется встроенный компаратор по умолчанию (подробности см. ниже — коротко, он сравнивает числа численно, а строки алфавитно).
Внутри
Сортировка указанного collection происходит в два этапа:
- Все элементы проходят через предикат (или предикаты), и возвращаемые значения сохраняются вместе с их типом (
string,numberи т. д.). Например, элемент{label: 'foo'}, прошедший через предикат, который извлекает значение свойстваlabel, преобразуется в:{ value: 'foo', type: 'string', index: ... }Примечание: значенияnullиспользуют'null'в качестве своего типа. - Функция компаратора используется для сортировки элементов на основе полученных значений, типов и индексов.
Если вы используете пользовательский компаратор, он будет вызываться с парами объектов вида {value: ..., type: '...', index: ...} и должен возвращать 0, если объекты равны (с точки зрения компаратора), -1, если первый должен быть выше второго, или 1, в противном случае.
Для обеспечения детерминированной сортировки на разных платформах, если ни один из указанных предикатов не может отличить два элемента, orderBy автоматически добавляет фиктивный предикат, который возвращает индекс элемента как value. (Если вы используете пользовательский компаратор, убедитесь, что он также может обработать этот предикат.)
Если пользовательский компаратор по-прежнему не может отличить два элемента, они будут отсортированы по их индексу с помощью встроенного компаратора.
Наконец, чтобы упростить задачу, если предикат возвращает объект в качестве извлеченного значения для элемента, orderBy попытается преобразовать этот объект в примитивное значение, прежде чем передать его компаратору. Следующие правила управляют преобразованием:
- Если у объекта есть метод
valueOf(), который возвращает примитивное значение, будет использовано его возвращаемое значение.
(Если у объекта есть методvalueOf(), который возвращает другой объект, то возвращаемый объект будет использован на последующих шагах.) - Если у объекта есть пользовательский метод
toString()(т. е. не наследуемый отObject), который возвращает примитивное значение, будет использовано его возвращаемое значение.
(Если у объекта есть методtoString(), который возвращает другой объект, то возвращаемый объект будет использован на последующих шагах.) - Без преобразования; используется сам объект.
Встроенный компаратор по умолчанию
Встроенного компаратора по умолчанию достаточно для большинства случаев. Коротко, он сравнивает числа численно, строки алфавитно (без учета регистра), а для объектов использует их индекс в исходном наборе, сортирует значения разных типов по типу и помещает undefined и null значения в конец отсортированного списка.
Более конкретно, он выполняет следующие действия для определения относительного порядка элементов:
- Если сравниваемые значения имеют разные типы:
- Если одно из значений равно undefined, оно считается "больше", чем другое.
- Если одно из значений равно null, оно считается "больше", чем другое.
- В противном случае сравниваются сами типы алфавитно.
- Если оба значения имеют тип
string, сравните их алфавитно, не учитывая регистр и локаль. - Если оба значения являются объектами, сравниваются их индексы.
- В противном случае вернуть:
-
0, если значения равны (строгое сравнение, т. е. с использованием===). -
-1, если первое значение меньше второго (сравнивается с помощью оператора<). -
1, в противном случае.
-
Примечание: Если вы заметите, что числа не сортируются ожидаемым образом, убедитесь, что они фактически сохраняются как числа, а не как строки. Примечание: Для целей сортировки null и undefined считаются "больше", чем любое другое значение (undefined > null). Это означает, что значения null и undefined оказываются в конце списка, отсортированного по возрастанию. Примечание: значения null используют 'null' в качестве своего типа, чтобы отличать их от объектов.
Использование
В привязке шаблонов HTML
{{ orderBy_expression | orderBy : expression : reverse : comparator}}
В JavaScript
$filter('orderBy')(collection, expression, reverse, comparator)
Аргументы
| Параметр | Тип | Подробности |
|---|---|---|
| collection | ArrayArrayLike |
Сортируемый набор (массив или объект, похожий на массив). |
| expression (необязательно) |
function()stringArray.<(function()|string)> |
Предикат (или список предикатов), используемый компаратором для определения порядка элементов. Может быть одним из:
Примечание: Если предикат отсутствует или пуст, по умолчанию используется |
| reverse (необязательно) |
boolean |
Если |
| comparator (необязательно) |
function() |
Функция компаратора, используемая для определения относительного порядка пар значений. Если опущена, используется встроенный компаратор. |
Возвращаемое значение
Array |
|
Примеры
Сортировка таблицы с помощью ngRepeat
В примере ниже показан простой ngRepeat, где данные отсортированы по возрасту по убыванию (выражение установлено на '-age'). comparator не установлен, поэтому используется встроенный компаратор по умолчанию.
Динамическое изменение параметров
Все параметры могут быть изменены динамически. Следующий пример демонстрирует, как можно сделать столбцы таблицы сортируемыми, связав параметры expression и reverse со свойствами области видимости.
Использование orderBy внутри контроллера
Также можно вызвать фильтр orderBy вручную, введя orderByFilter и вызвав его с нужными параметрами. (Альтернативно, вы можете ввести фабрику $filter и получить фильтр orderBy с помощью $filter('orderBy')).
Использование пользовательского компаратора
Если у вас есть очень специфические требования к способу сортировки элементов, вы можете передать свою собственную функцию компаратора. Например, вам может потребоваться сравнить некоторые строки с учетом локали. (При указании пользовательского компаратора вам также необходимо передать значение для аргумента reverse — передача false сохраняет порядок сортировки по умолчанию, т. е. по возрастанию.)
© 2010–2018 Google, Inc.
Licensed under the Creative Commons Attribution License 4.0.
https://code.angularjs.org/1.7.8/docs/api/ng/filter/orderBy