原文:205 Row Edit Feature ui.grid.rowedit 扩展了编辑功能, 以支持对服务器保存数据的回调, 该数据同时保存了 “行”。此功能尝试给用户一个类似于 电子表格 的体验, 以便他们可以编辑他们希望的任何字段, 并且该功能将试图保存数据 “行”。在数据不会产生错误的程度上, 从用户的角度来看, 保存过程几乎是无形的–保存后变灰色, 和不能编辑的灰色, 用户就像数据是本地的一样进行编辑。 rowEdit 功能的文档在 api 文档中提供, 特别是: gridOptio 阅读更多…

原文:204 Column Resizing “调整列大小” 功能允许调整每个列的大小。 要启用, 必须包含 “ui.grid.resizeColumns” 模块, 并且必须在表格元素上包括 ui-grid-resize-columns 的指令。 “调整列大小” 功能的文档在 api 文档中提供, 特别是: columnDef gridOptions publicApi 可以将单独的列设置为not resizeable,如果这样做, 建议将这些列设置固定的像素宽度,否则, 如果其他列的大小减小, 阅读更多…

原文: 203 Pinning 锁定功能允许用户将列向左或向右锁定。要启用, 必须包括 “ui.grid.pinning” 模块, 并且必须在表格元素上写上 ui-grid-pinning指令。 在 api 文档中提供了固定功能的文档, 特别是: – columnDef – gridOptions – publicApi 还可以禁用列级别上的锁定。请注意下面示例中的 “id” 列定义。 代码: index.html <!doctype html> 阅读更多…

原文:202 Cell Navigation 此示例使用 ui-grid-cellNav指令添加单元格导航。要启用, 必须包括 “ui.grid.cellNav” 模块, 并且必须在表格元素上包括ui-grid-cellNav指令。 CellNav 功能的文档在 api 文档中提供, 特别是: columnDef gridOptions publicApi CellNav 允许您使用箭头键、pg-down 和 pg-up 在网格周围导航、输入 (下移)、shift 输入 (向上移动)、tab ( 阅读更多…

原文:201 Edit Feature ui.grid.edit 功能允许对表格数据进行内嵌编辑。要启用, 必须包括 “ui.grid.edit” 模块, 必须在表格元素上包括ui-grid-edit编辑指令。 api 文档中提供了编辑功能的文档, 特别是: columnDef gridOptions publicApi 可以使用列定义中的 enableCellEdit 选项来允许列可编辑。 通过双击、f2、或开始键入任何 non-navigable 键来调用编辑。可以通过tab, enter 阅读更多…

原文:190 Large Dataset 这个表格示例使用10000个记录的数据集。 演示如下: – 绑定复杂的列属性 城市.地址。 – 同一字段可以在具有不同名称的表格中列出两次 – 使用字段而不是名称便于2.x 向后兼容 代码: index.html <!doctype html> <html ng-app=”app”> <head> <script src=”http://ajax.googleapis.com/ 阅读更多…

原文:122 Accessibility 无障碍性 (或 A11Y) 通常是 web 开发中被忽略的方面。确保您的内容是可访问的, 类似于确保您的内容在所有主要浏览器上都可见。如果您在设计网站时不考虑辅助功能, 则您的内容将无法供所有用户使用。 先决条件: 引入 angular-aria (Angular 1.3.0+)。 <script src=”http://ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular.js”>&l 阅读更多…

原文:121 Grid Menu 表格菜单栏可以通过gridOption 中设置 enableGridMenu: true 来开启。这将在表格的右上方添加一个图标,该图标浮动在列标题的上方。默认菜单可以显示/隐藏列,还可以自定义额外的动作。 每个菜单项都可以自定义功能: shown:一个function,用来决定该项是否显示的 title:菜单项显示的标题(注意,也可以使用 i18n 通过 gridMenuTitleFilter 设置) icon:显示在项目旁边的图标 action:当菜单被点击 阅读更多…

原文:117 Tooltips 当用户悬停在单元格上时,可以设置工具提示。 在columnDef 中设置 cellTooltip: true 后,此工具提示可以简单的单元格内容。 或者,它可以接收function 返回的当前列和行的值,例如: cellTooltip: function(row, col) { return ‘Name: ‘ + row.entity.name + ‘ Company: ‘ + row.entity.company; } 或者它可以是一个字符串,在这种情况下,字符 阅读更多…