我想知道如何在加载数据之前显示一个简单的加载器.我正在使用ng-grid-1.3.2我正在使用Google搜索,但我没有找到任何示例.再见
如何在ng-grid中创建(或访问)所选行的数组？
id | default value | definition
-----------------------------------------------
selectedItems | [] | all of the items selected in the grid.
In single select mode there will only
be one item in the array.
<body ng-controller="MyCtrl">
<div class="gridStyle" ng-grid="gridOptions"></div>
<h3>Rows selected</h3>
<pre>{{selectedItems}}</pre>
</body>
var app = angular.module('myApp', ['ngGrid']);
app.controller('MyCtrl', function($scope) {
$scope.myData = [{name: "Moroni", age: 50},
{name: "Tiancum", age: 43},
{name: "Jacob", age: 27},
{name: "Nephi", age: 29},
{name: "Enos", age: 34}];
$scope.gridOptions = …data-binding angularjs angularjs-directive angularjs-scope ng-grid
我们想使用Angular UI ng-grid,但似乎找不到一个选项来告诉网格中的视口不要将溢出设置为auto而不是滚动.
我们想要做的是根据网格中行数的大小使表/网格高度动态化.我们有一个固定的最大行数,因此几乎不用担心DOM中有太多行.
关于去哪里的任何建议？
我在angularjs应用程序中有一个视图,我希望允许用户在各种不同配置的网格之间进行选择.理想情况下,我想将传递给ng-grid指令的值绑定到模型变量,如下所示.但是,虽然此示例呈现的标记在将简单字符串值传递给ng-grid时有效(即<div class="gridStyle" ng-grid="gridOptions1"></div>,动态配置失败).
var app = angular.module('myApp', ['ngGrid']);
app.controller('MyCtrl', function($scope) {
$scope.option;
$scope.myData = [{name: "Moroni", age: 50},
{name: "Tiancum", age: 43},
{name: "Jacob", age: 27},
{name: "Nephi", age: 29},
{name: "Enos", age: 34}];
$scope.gridOptions1 = { data: 'myData',
columnDefs: [{ field:"name", displayName: "NAME"},
{ field:"age", displayName: "AGE"}],
multiSelect: true };
$scope.gridOptions2 = { data: 'myData',
columnDefs: [{ field:"name", displayName: "Name"},
{ field:"age", displayName: "Age"}],
multiSelect: false };
});
<body ng-controller="MyCtrl">
<label>Show me:</label>
<input type="radio" name="option" ng-model="option" value="gridOptions1">Grid …我的问题是这个问题的延伸
plunker - http://plnkr.co/edit/DiDitL?p=preview
我需要在页面加载时选择一行,我需要避免收听'ngGridEventData'
调用$ scope.gridOptions.selectRow(2,true); 由于网格尚未加载,因此控制器主体失败.
避免监听ngGridEventData是因为我需要控制器监听之前触发的事件,并根据我需要选择nggrid行.
有任何想法吗？
我想为ng-grid启用页脚,但我想完全自定义它并覆盖默认情况下ng-grid的功能.
基本上,我只想在网格底部添加一个"加载更多..."链接,根据pagingOptions.pageSize设置的内容从服务器加载更多行,并在动态扩展时将其附加到网格底部视口高度,所以没有滚动条.
是否有配置挂钩,或者我在哪里/如何做到这一点？
谢谢.
我似乎无法在新的ngGrid(ui-Grid)rc build v3.0.0-rc.11中使用任何分页或列重新调整大小.根据这个例子,它应该是非常直接的:http: //ui-grid.info/docs/#/tutorial/401_AllFeatures
对于我的主要div,如果我这样做:
<div ui-grid="productGridOptions" ui-grid-resize-columns class="uiGridProducts">
并在我的控制器中执行此操作:
$scope.productGridOptions={};
$scope.productGridOptions.enableColumnResizing = true;
$scope.productGridOptions.enableFiltering = false;
$scope.productGridOptions.enablePaging = true;
$scope.productGridOptions.pagingOptions = {
pageSizes: [250, 500, 1000],
pageSize: 250,
currentPage: 1
};
$scope.productGridOptions.rowIdentity = function(row) {
return row.id;
};
$scope.productGridOptions.getRowIdentity = function(row) {
return row.id;
};
$scope.productGridOptions.data = 'products';
//The options for the data table
$scope.productGridOptions.columnDefs = [
{ name:'ID', field: 'id' },
{ name:'Product', field: 'productName' },
{ name:'Active Ing.', field: 'activeIngredients'},
{ name:'Comments', field: 'comments' } …我用ng-grid设置了以下内容:
var gridData = {};
$scope.gridOptions = {
data: 'gridData',
enableCellEdit: true,
multiSelect: false,
columnDefs: [
{ field: 'testId', displayName: 'Test Id' },
{ field: 'name', displayName: 'Name', enableCellEdit: true, editableCellTemplate: cellEditableTemplate },
{ field: 'description', displayName: 'Description', enableCellEdit: true, editableCellTemplate: cellEditableTemplate },
{ field: '', cellTemplate: '<button ng-click="delete(row)">Delete</button>' }
]
};
和:
$scope.delete = function (row) {
row.entity.$deleteData({ testId: row.entity.testId });
}
这会将HTTP消息发送到删除该行的服务器.但是该行仍然保留在网格中.我怎么能这样做,所以单击行上的删除按钮也会从gridData对象中删除一行？
我正在尝试使用Angular ng-grid来显示一些动态内容.网格将有0到25行.我希望有一个最小尺寸,然后让ng-grid自动调整高度,因为项目会添加到数组中.由于某些原因,添加6-7项后自动尺寸停止(它甚至似乎取决于您的分辨率).
有人可以帮忙吗？我错过了什么？我下面有一个Plunker,显示了这个问题.
有没有办法将单元格文本值对齐到中心/右边？谢谢.
这是一个plnkr基本示例.