ui-grid angular js - 单元格卡在编辑模式

Question

我在使用 ui-网格时添加了一个自定义的可编辑单元格模板。问题是一旦单元格进入编辑模式，它就会一直存在。单元格模板稍后完全不显示。

这是我正在使用的Javascript：

name: app.localize('IsHiddenName'),
field: 'isHidden',
type: 'boolean',
cellTemplate:
    '<div class=\"ui-grid-cell-contents text-center\">' +
    '  <i class="fa fa-check-circle font-green" ng-if="row.entity.isHidden"></i>' +
    '</div>',
editableCellTemplate:
    '<div style="margin:5px;">' +
    '<div class="md-checkbox-list">' +
    '<div class="md-checkbox">' +
       '<input type="checkbox" id="check2-{{row.entity.id}}" class="md-check" ng-class="\'colt\' + col.uid" ui-grid-editor ng-model="MODEL_COL_FIELD">' +
       '<label for="check2-{{row.entity.id}}"><span class="inc"></span><span class="check"></span><span class="box"></span></label>' +
   '</div>' +
   '</div>'+
   '</div>',

Answer 1

这个问题是由于误解ui网格自定义可编辑模板造成的。

UI 网格未自行完成单元格编辑。正在等待事件
uiGridEditConstants.events.END_CELL_EDIT.

此事件由 2 个 ui-grid 指令发出：

对于输入元素：ui-grid-editor （你的情况）:
<input ui-grid-editor type="checkbox" id="check2-{{row.entity.id}}" ... >
对于 select 元素：ui-grid-edit-dropdown:
<select ui-grid-edit-dropdown ... >
对于自定义元素：您必须自己发出事件： scope.$emit(uiGridEditConstants.events.END_CELL_EDIT);

ui-grid angular js - 单元格卡在编辑模式

ui-grid angular js - cell stuck in edit mode

angularjs-directive

angular-ui-grid

angular