是否有可能到列的排序绑定到不同的属性比角UI电网的显示属性? [英] Is it possible to bind the sorting of a column to a different property than its display property with Angular UI Grid?

查看:178
本文介绍了是否有可能到列的排序绑定到不同的属性比角UI电网的显示属性?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我只是想知道是否有人知道的方式相同的顺序采用了棱角分明的UI电网的另一列进行排序的列。

I was just wondering if anyone knew of a way to sort a column in the same order as another column using Angular UI Grid.

推荐答案

我猜你的意思是,如果(举例来说)你有名和姓列分别显示姓氏和名字,你想点击排序的姓,这实际上是排序表中的名的命令?

I'm guessing you mean that if (for example) you have "First Name" and "Last Name" columns which display first name and last name respectively, you want to click sort on "Last Name" and this actually sorts the table in order of "First Name"?

如果是这样,你可以使用细胞模板做到这一点。

If so, you can accomplish this using a cell template.

假设你有如下表:

在这里输入的形象描述

当你排序的姓列,它实际上会在名列中的数据进行排序表。

and when you sort the "Last Name" column it will actually sort the table in order of the data in the "First Name" column.

假设下列数据:

$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 属性显示在单元格,然而由于该列的字段势必的firstName 当列进行排序它是在的firstName排序这意味着

The column definition for the second column names the column "Last Name" and the cell template ensures the lastName attribute is displayed in the cell, however as the column's field is bound to firstName it means when the column is sorted it is sorted on firstName.

一个例子可以发现这里。排序的第二列(姓)和行实际上将在第一列中的顺序(名字)。进行排序

An example can be found here. Sort the second column (Last Name) and the rows will actually be sorted in order of the first column (First Name).

这篇关于是否有可能到列的排序绑定到不同的属性比角UI电网的显示属性?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆