如何以编程方式编辑ng-grid的单元格

Question

每行都有一个带有编辑按钮的ng-grid。现在，当我单击编辑按钮时，我希望该行的所有单元格都处于可编辑模式。与双击每个单元格时的效果相同。我怎样才能做到这一点。如果您能提供示例代码，那就太棒了。

提前致谢。

Answer 1

我是根据this question的代码完成的。

我们的想法是在每个文档中添加edit属性：

$scope.myData = [{
    name: "Moroni",
    age: 50,
    edit: false
}, {
    name: "Tiancum",
    age: 43,
    edit: false
}];

然后使用编辑按钮反转该属性。

$scope.edit = function (row) {
    row.entity.edit = !row.entity.edit;
};

使用cellTemplates，您可以将单元格更改为输入：

cellTemplate: '<div class="ngCellText"><div ng-show="!row.entity.edit">{{row.getProperty(col.field)}}</div>' +
            '<div ng-show="row.entity.edit" class="ngCellText"><input type="text" ng-model="row.entity.name"/></div></div>'

查看工作小提琴here。