标签: ng-grid

我们如何在ng-grid中添加一行然后选择该行?

我的团队一直在尝试以下方面:

   $scope.addTest = function () {
        var TestRow = {
            "name": "xx",
            "description": "xx",
            "subjectId": 15
        };
        $scope.gridOptions.selectAll()
        var testRowLength = $scope.gridData.push(TestRow);
        $scope.gridOptions.selectItem(testRowLength - 1, true);
    }
Run Code Online (Sandbox Code Playgroud)

但是最后一个selectItem没有正确执行select.所以我们尝试了以下方法:

        $scope.$apply(function () {
            $scope.gridData.push(TestRow);
            $scope.gridOptions.selectItem(testRowLength - 1, true);
        });
Run Code Online (Sandbox Code Playgroud)

现在我们收到一条错误消息:

Error: $apply already in progress
Run Code Online (Sandbox Code Playgroud)

这个问题是在ng-grid博客上发布的一个问题,但它刚刚发布,我们需要尽快帮助解决这个问题.我希望有人可以就我们的方式向我们提出建议

angularjs ng-grid

4
推荐指数
1
解决办法
5007
查看次数

从excel粘贴到ngGrid中

伙计们,

有谁知道如何使ng-grid与excel一起工作,即提供从excel复制粘贴到网格中的能力?

我知道的

enableCellEdit: true 
Run Code Online (Sandbox Code Playgroud)

属性但不会使网格与excel一起工作.

excel angularjs ng-grid

4
推荐指数
1
解决办法
8928
查看次数

ng-grid原始行索引

我在ng-grid中定制一个单元格模板.在那个单元格中,我想要一个按钮,它会触发一些需要行索引进入原始数据数组的事件.模板看起来像这样:

<button class="btn" ng-click="removeItem(row.rowIndex)">
  <i class="icon-remove"></i>
</button>
Run Code Online (Sandbox Code Playgroud)

removeItem实现如下:

$scope.removeItem = function(rowIndex) { $scope.myList.splice(rowIndex, 1) }
Run Code Online (Sandbox Code Playgroud)

这有效,直到我通过单击其中一列重新排序网格.显然,rowIndex是行的可视索引,而不是我提供的数组中行的索引.

有没有办法获得实际指数?

angularjs ng-grid

4
推荐指数
1
解决办法
1万
查看次数

AngularJS在按键上更改多行选择ng-grid属性

我的视图中定义了以下网格

<div class="gridStyle hide" ng-grid="resultsOptions" id="resultsGrid"></div>
Run Code Online (Sandbox Code Playgroud)

并且我只想在按下ctrl键时允许multiSelect.所以我在Controller中将multiSelect属性定义为false.

$scope.resultsOptions = {
    data: 'searchData',
    selectedItems: $scope.mySelections,
    multiSelect: false,
    enableHighlighting: true,
    enableRowSelection: true
};
Run Code Online (Sandbox Code Playgroud)

在同一个控制器中,我有以下代码将multiSelect设置为true.

$("#resultsGrid").keydown(function (e) {
    if (e.ctrlKey) {
        $scope.resultsOptions.multiSelect = true;
        $scope.$apply();
    }
});
Run Code Online (Sandbox Code Playgroud)

当我按下ctrl后启动应用程序multiSelect值更改.但我仍然无法做出多重选择.

我试图将变量用于multiSelect,但它不会改变一个东西.

以下示例也不会更改multiSelect属性.但它改变了网格标题. http://plnkr.co/edit/RwYSG4?p=preview

有没有简单的解决方案?或者我的代码中有什么错过?

angularjs ng-grid

4
推荐指数
1
解决办法
1万
查看次数

AngularJS ng-grid - 动态更新列和结果

我是ng-grid的新手.我们如何动态更新网格中的列和结果.

我创建了一个http://plnkr.co/edit/CwUVIzSKVNCMTgpOW87f?p=preview

脚本

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: 'myData',
        columnDefs: [{field: 'name', displayName: 'Name'}, {field:'age', displayName:'Age'}]
    };

    $scope.update_columns = function($event){ console.log("asd")
      $scope.myData = [{new_name: "Moroni", new_age: 50, pin: 123},
       {new_name: "Tiancum", new_age: 43, pin: 345},
       {new_name: "Jacob", new_age: 27, pin: 567},
       {new_name: "Nephi", new_age: 29, pin: 789},
       {new_name: "Enos", new_age: …
Run Code Online (Sandbox Code Playgroud)

javascript angularjs angularjs-scope ng-grid

4
推荐指数
1
解决办法
2万
查看次数

angularjs ui-grid 3.0键导航

我热衷于从ng-grid 2迁移到新的ui-grid 3.0替代品.事情到目前为止看起来不错 我无法弄清楚的一件事是如何使用向上和向下箭头键启用记录导航.当multiSelect设置为false时,这与ng-grid开箱即用.

angularjs ng-grid angular-ui-grid

4
推荐指数
1
解决办法
6643
查看次数

角度ui网格行模板颜色基于条件

我需要根据某些条件改变角度ui网格的行颜色.如图所示,目标在ng-grid中实现

 rowTemplate: '<div style="height: 100%" ng-class="{red: row.getProperty(\'viewed\') < 1}"><div ng-style="{ \'cursor\': row.cursor }" ng-repeat="col in renderedColumns" ng-class="col.colIndex()" class="ngCell ">' +
             '<div class="ngVerticalBar" ng-style="{height: rowHeight}" ng-class="{ ngVerticalBarVisible: !$last }"> </div>' +
            '<div ng-cell></div>' +
            '</div></div>',
Run Code Online (Sandbox Code Playgroud)

如何在角度ui网格中实现相同

angularjs ng-grid angular-ui-grid

4
推荐指数
3
解决办法
3万
查看次数

如何在ng-grid中呈现html格式的内容?

我有jsonData,它包含HTML内容.我想在ng-grid中呈现HTML.但是,内容未呈现 - 它仅以正常的字符串格式显示.

下面plnkr显示了所有代码:

http://plnkr.co/edit/RlWyDqCUUR15dmLM7ePV?p=preview

angularjs angularjs-directive ng-grid

4
推荐指数
1
解决办法
4510
查看次数

ngGrid cellFilter和cellTemplate无法一起使用

我使用ngGrid来显示我的数据.我想将cellFilter和cellTemplate一起用于特定列,但似乎它们不能一起工作.当我单独使用cellFilter或cellTemplate时,它们完美无缺.基本上,我想以这种方式格式化单元格的值(例如500000 - > 500,000; 1000000 - > 1,000,000),我也希望以红色显示负值.我怎么解决这个问题?谢谢!

$scope.gridOptions = {
        data: 'data',
        columnDefs: [
            {
                field: 'Settled',
                cellFilter: 'number',
                cellTemplate: '<div ng-class="{red: row.getProperty(col.field) < 0}"><div class="ngCellText">{{row.getProperty(col.field)}}</div></div>'
            }]
        }
Run Code Online (Sandbox Code Playgroud)

celltemplate cell-formatting angularjs ng-grid angular-ui-grid

4
推荐指数
1
解决办法
3401
查看次数

angular-ui-grid中所选行的自定义颜色

我想改变角度-ui网格的单元格/行颜色.从文档中我似乎应该使用cellClass.我想要两种颜色用于条纹外观,另一种颜色用于当前选定的行.

在我的columnDefs中,我使用一个函数来确定正确的cellClass.这在首次加载时非常有效.

$scope.getCellClass = function (grid, row, col, rowRenderIndex, colRenderIndex) {
    if (row.isSelected)
        return 'my-grid-cell-selected';

    if ((rowRenderIndex % 2) == 0) {
        return 'my-grid-cell1';
    }
    else {
        return 'my-grid-cell2';
    }
}

$scope.gridOptions = {
    enableRowSelection: true,
    enableRowHeaderSelection: false,        
    multiSelect: false,
    columnDefs: [
      { field: 'EventDate', cellClass: $scope.getCellClass },
      ...
    ]
};
Run Code Online (Sandbox Code Playgroud)

但是,我不知道如何更新所选行的所有单元格的cellClass.我有以下代码,我认为会更新所选行,但没有任何反应,虽然我可以看到它被调用.

$scope.gridOptions.onRegisterApi = function (gridApi) {
    $scope.gridApi = gridApi;

    gridApi.selection.on.rowSelectionChanged($scope, function(row){
        //??????
        gridApi.core.notifyDataChange(uiGridConstants.dataChange.ROW);
    });

};
Run Code Online (Sandbox Code Playgroud)

如果没有我的cellClasses,所选行的颜色会有所不同.

知道如何为所选行实现自定义颜色吗?

ng-grid angular-ui-grid

4
推荐指数
1
解决办法
1万
查看次数