2

我正在使用来自 AngularJS 的 ng-grid：

var app = angular.module('myApp', ['ngGrid']);
    app.controller('MyCtrl', function($scope) {
        $scope.myData = gridData;
        $scope.gridOptions = {
                        data: 'myData',
                        columnDefs: ColumnArray
                        };
    });

我想更改单元格内的单元格文本。怎么做？我正在使用 cellTemplate：

ColumnObject.cellTemplate = GetCellTemplate();

但是，我的 GetCellTemplate方法无法读取当前单元格中的数据{{ row.getProperty(col.field) }} 。为了能够读取单元格数据/文本并在运行时更改它，该怎么做。

例如，如果我的单元格有“我的姓名图像”之类的文本，我希望能够将“图像”一词更改为真实图像并将其显示在我的 ng-grid 中。

我怎样才能做到这一点？

4

2 回答 2

1

您可以在 cellTemplate 中使用角度指令。

例如：

.directive('replacewithimage', function(){
            return {
                restrict: 'C',
                replace: true,
                transclude: true,
                scope: { colValue:'@colValue' },
                 template: '<div ng-switch="colValue">' +
                    '<div ng-switch-when="IMAGE"><img src="#"></div> '     +
                    '<div ng-switch-default>{{valor}}</div> '
                    +'</div>'
            }


    })

然后在 ng-grid 的 cellTemplate 中使用它，将“类”名称作为“replacewithimage”传递，将值作为“colValue”属性

> ..
  cellTemplate: '<div> class="replacewithimage"
> colValue="{{row.getProperty(col.field)}}"></div>'},
..
于 2013-07-08T03:11:48.660 回答
0

@l2mt，我通过以下更改尝试了您的示例：

template: '<div ng-switch="colValue">' +
            ' <div ng-switch-when="1">Valid Data</div>' +
            '<div ng-switch-when="2">Invalid Data</div>' +
            '<div ng-switch-default>NONE</div>' +
          '</div>

ng-grid 列中有 2 行，值为 1 和 2。

cellTemplate 与您的代码相同。但它对非“有效数据”或“无效数据”的两行都显示 NONE。

于 2013-08-02T22:18:18.470 回答