Spec-Zone.ru › Angular.js 1.8

Улучшить эту документацию Просмотреть исходный код orderBy

  1. фильтр в модуле ng

Обзор

Возвращает массив, содержащий элементы из указанного collection, отсортированные функцией сравнения comparator на основе значений, вычисленных с помощью предиката expression.

Например, [{id: 'foo'}, {id: 'bar'}] | orderBy:'id' приведет к [{id: 'bar'}, {id: 'foo'}].

collection может быть массивом или объектом, подобным массиву (например, NodeList, jQuery-объект, TypedArray, строка и т. д.).

expression может быть одним предикатом или списком предикатов, каждый из которых служит для разрешения ничьих в сравнении с предыдущим. expression вычисляется для каждого элемента, а результат используется для сравнения с другими элементами.

Вы можете изменить порядок сортировки, установив reverse в true. По умолчанию элементы сортируются по возрастанию.

Сравнение выполняется с помощью функции comparator сравнения. Если она не указана, используется встроенная функция сравнения (подробнее см. ниже — коротко, она сравнивает числа численно, а строки алфавитно).

Внутри

Сортировка указанного collection происходит в два этапа:

  1. Все элементы передаются через предикат (или предикаты), и возвращаемые значения сохраняются вместе с их типом (string, number и т. д.). Например, элемент {label: 'foo'}, прошедший через предикат, извлекающий значение свойства label, преобразуется в:
    {
      value: 'foo',
      type: 'string',
      index: ...
    }
    
    Примечание: Значения null используют 'null' в качестве своего типа.
  2. Функция сравнения используется для сортировки элементов на основе полученных значений, типов и индексов.

Если вы используете пользовательскую функцию сравнения, она будет вызываться с парами объектов вида {value: ..., type: '...', index: ...} и должна возвращать 0 , если объекты равны (с точки зрения функции сравнения), -1 , если первый объект должен иметь более высокую позицию, чем второй, или 1 в противном случае.

Для обеспечения детерминированности сортировки на разных платформах, если ни один из указанных предикатов не может различить два элемента, orderBy автоматически введёт фиктивный предикат, возвращающий индекс элемента в качестве value. (Если вы используете пользовательскую функцию сравнения, убедитесь, что она также может обрабатывать этот предикат.)

Если пользовательская функция сравнения по-прежнему не может различить два элемента, они будут отсортированы по индексу с помощью встроенной функции сравнения.

Наконец, в попытке упростить вещи, если предикат возвращает объект в качестве извлеченного значения для элемента, orderBy попытается преобразовать этот объект в примитивное значение перед передачей его в функцию сравнения. Следующие правила управляют преобразованием:

  1. Если у объекта есть метод valueOf(), который возвращает примитивное значение, его возвращаемое значение будет использоваться вместо объекта.
    (Если у объекта есть метод valueOf(), который возвращает другой объект, тогда возвращаемый объект будет использован на последующих этапах.)
  2. Если у объекта есть пользовательский метод toString() (то есть не унаследованный от Object), который возвращает примитивное значение, его возвращаемое значение будет использоваться вместо объекта.
    (Если у объекта есть метод toString(), который возвращает другой объект, то возвращаемый объект будет использован на последующих шагах.)
  3. Без преобразования; сам объект используется.

Встроенная функция сравнения

Встроенная функция сравнения должна быть достаточной для большинства случаев использования. Короче говоря, она сравнивает числа численно, строки алфавитно (и регистронезависимо), а для объектов использует их индексы в исходном наборе, сортирует значения разных типов по типу и помещает значения undefined и null в конец отсортированного списка.

Более конкретно, она выполняет следующие шаги для определения относительного порядка элементов:

  1. Если сравниваемые значения имеют разные типы:
    • Если одно из значений равно undefined, считается, что оно "больше", чем другое.
    • Если одно из значений равно null, считается, что оно "больше", чем другое.
    • В противном случае сравниваются сами типы алфавитно.
  2. Если оба значения имеют тип string, сравните их алфавитно, не учитывая регистр и язык.
  3. Если оба значения являются объектами, сравните их индексы.
  4. В противном случае верните:
    • 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)>

Предикат (или список предикатов), используемый функцией сравнения для определения порядка элементов.

Может быть одним из:

  • Function: Функция-получатель. Эта функция будет вызываться для каждого элемента, а возвращаемое значение будет использовано для сортировки.
  • string: Выражение AngularJS. Это выражение будет вычисляться для каждого элемента, а результат будет использован для сортировки. Например, используйте 'label' для сортировки по свойству с именем label или 'label.substring(0, 3)' для сортировки по первым 3 символам свойства label.
    (Результат константного выражения интерпретируется как имя свойства, используемого для сравнения. Например, используйте '"special name"' (обратите внимание на дополнительную пару кавычек) для сортировки по свойству с именем special name.)
    Выражение может быть необязательно префиксным + или - для управления направлением сортировки, по возрастанию или по убыванию. Например, '+label' или '-label'. Если свойство не указано (например, '+' или '-'), в сравнениях используется сам элемент коллекции.
  • Array: Массив предикатов-функций и/или строк. Если предикат не может определить относительный порядок двух элементов, используется следующий предикат как решающий.

Примечание: Если предикат отсутствует или пуст, он по умолчанию равен '+'.

reverse
(необязательно)
boolean

Если true, обратный порядок сортировки.

comparator
(необязательно)
function()

Функция сравнения, используемая для определения относительного порядка пар значений. Если она опущена, используется встроенная функция сравнения.

Возвращаемое значение

Array
  • Отсортированный массив.

Примеры

Сортировка таблицы с ngRepeat

В приведенном ниже примере показан простой ngRepeat, где данные сортируются по возрасту в порядке убывания (выражение установлено в '-age'). comparator не указан, поэтому используется встроенная функция сравнения.

Динамическое изменение параметров

Все параметры могут быть изменены динамически. Следующий пример демонстрирует, как сделать столбцы таблицы сортируемыми, связав параметры expression и reverse со свойствами области видимости.

Использование orderBy внутри контроллера

Также можно вызвать фильтр orderBy вручную, введя orderByFilter, и вызвав его с нужными параметрами. (В качестве альтернативы вы можете ввести фабрику $filter и получить фильтр orderBy с помощью $filter('orderBy').)

Использование пользовательской функции сравнения

Если у вас есть очень специфические требования к сортировке элементов, вы можете передать свою собственную функцию сравнения. Например, вам может потребоваться сравнить некоторые строки с учётом языка. (При указании пользовательской функции сравнения, вы также должны передать значение для аргумента reverse — передача false сохраняет стандартный порядок сортировки, т. е. по возрастанию.)

© 2010–2020 Google, Inc.
Licensed under the Creative Commons Attribution License 3.0.
https://code.angularjs.org/1.8.2/docs/api/ng/filter/orderBy

Spec-Zone.ru

Настройки Оффлайн Что нового Помощь О нас
Spec-Zone .ru
спецификации, руководства, описания, API