2016-01-21 4 views
1

Мне просто интересно, знал ли кто-нибудь о способе сортировки столбца в том же порядке, что и другой столбец с использованием Angular UI Grid.Можно ли связать сортировку столбца с другим свойством, чем его свойство отображения с помощью Углового интерфейса пользователя?

ответ

2

Я предполагаю, что вы имеете в виду, что если (например) у вас есть столбцы «Имя» и «Фамилия», которые отображают имя и фамилию соответственно, вы хотите щелкнуть по имени «Фамилия», и это фактически сортирует таблицу в порядке «Имя»?

Если это так, вы можете выполнить это, используя шаблон ячейки.

Предположим, у вас есть следующая таблица:

enter image description here

и при сортировке столбца «Last Name» будет фактически сортировать таблицу в порядке данных в столбце «First Name».

Предполагая следующие данные:

$scope.gridOptions.data = [{ 
    "firstName": "David", 
    "lastName": "Carney", 
}, { 
    "firstName": "Bob", 
    "lastName": "Wise", 
}, { 
    "firstName": "Peter", 
    "lastName": "Thompson", 
}]; 

Определить свой columnDefs следующим образом:

$scope.gridOptions.columnDefs = [{ 
    name: 'firstName', 
    field: 'firstName' 
}, { 
    name: 'lastName', 
    field: 'firstName', 
    cellTemplate: '<div class="ui-grid-cell-contents">{{row.entity.lastName}}</div>' 
}]; 

Определение столбца для вторых имен столбцов в столбце «Фамилия» и шаблон ячейки обеспечивает lastName атрибут отображается в ячейке, однако, поскольку field столбца привязан к firstName, это означает, что при сортировке столбца он сортируется по firstName.

Пример может быть найден here. Сортировка второго столбца (Фамилия) и строки будут отсортированы по порядку первого столбца (Имя).

+0

спасибо, это сработало отлично! – accasio

+0

В этом случае вам нужно даже перезаписать редактируемый шаблон ячейки для определения столбца «lastName» –

1

Сетка передает даже строки в качестве аргументов вместе с значениями поля в функцию сортировки. Он вызывает функцию сортировки, например, такую ​​как:

sortFn(propA, propB, rowA, rowB, direction); 

Вы можете использовать эту дополнительную информацию для сортировки данных соответствующим образом.

Вы можете указать sortFunc по свойству sortingAlgorithm для colDef.

Это происходит из версии ui-grid 3.0.7

 Смежные вопросы

  • Нет связанных вопросов^_^