在ng-grid angularjs中固定列

pinning columns in ng-grid angularjs

默认情况下，我尝试将ng-grid中的前两列和后两列固定。我知道我可以将所需的列设置为固定，例如下面的代码

1
2
3
4
5

$scope.gridOptions = {
enablePinning: true,
columnDefs: [{ field:"name", width: 120, pinned: true }
//...
};

但是我不希望用户像下面的示例那样更改它

http://plnkr.co/edit/UfFnsZ?p=预览

我的意思是列应该是固定的，用户不应该对其进行编辑。我搜索了但找不到任何示例。如果可以的话，有人可以帮忙...

或者您可以利用以下CSS：

1
2
3

.ngPinnedIcon, .ngUnPinnedIcon{
display: none;
}

这将隐藏所有用于固定和取消固定的图标。它对我有用，因为我不希望用户更改列的固定。

为此特定列使用自定义headerCellTemplate。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52

var hc_nopin="\
" +
"\
" +
" {{col.displayName}}\
" +
"\
" +
" \
" +
"\
" +
" \
" +
"\
" +
" {{col.sortPriority}}\
" +
"\
" +
" \
" +
"\
" +
"\
" +
"\
" +
"\
" +
"\
";

$scope.gridOptions = {
data: 'myData',
enablePinning: true,
columnDefs: [{
field:"name",
width: 120,
pinned: true,
headerCellTemplate: hc_nopin
}, {
field:"age",
width: 120
}, {
field:"birthday",
width: 120
}, {
field:"salary",
width: 120
}]
};

在自定义的hc_nopin模板中，我刚刚删除了ng-click命令以切换固定状态。
如果您也不想固定图标，只需删除相应的行即可。

这是叉状柱塞