Question

只有在使用cellTemplate / editableCellTemplate时，我才能在单击中获得角度ui网格以进入单元格中的编辑模式。这是一个说明我目前的代码和我遇到的问题的plunker。如果单击“名称”列下的单元格，您会发现它是单击，但“类型”列下的单元格是双击，需要单击。

重现的步骤：

点击ID列
单击名称列下的单元格（单击时注意编辑！）
再次单击id列下的单元格，或单击网格的空白区域，或单击网格
点击类型列下的单元格（应该是单击以编辑模式，需要双击）

working plunker here

`var app = angular.module('app', ['ngTouch', 'ui.grid', 'ui.grid.edit',` 'ui.grid.resizeColumns', 'ui.grid.moveColumns', 'ui.grid.autoResize', "ui.grid.pagination", "ui.grid.edit", "ui.grid.cellNav", "ui.grid.selection", "ui.grid.pinning"]); //draggableRows?

app.controller('MainCtrl', ['$scope', function ($scope) {

    $scope.gridOptions = {
        excludeProperties: '__metadata',
        enablePaginationControls: false,
        useExternalSorting: true,
        useExternalFiltering: true,
        enableFiltering: true,
        onRegisterApi: function (gridApi) {
            $scope.gridApi = gridApi;
            $scope.gridApi.edit.on.afterCellEdit($scope, function (rowEntity, colDef, newValue, oldValue) {
            });
        }
    };

    $scope.gridOptions.columnDefs = [
        {
            name: 'id',
            enableCellEdit: false,
            width: '10%',
            pinnedLeft: true,
        },
        {
            name: 'name',
            enableCellEdit: false,
            displayName: 'Name',
            width: '20%',
            pinnedLeft: true,

        },
        {
            name: 'type',
            displayName: 'Type',
            enableCellEdit: true,
            enableCellEditOnFocus: true,
            cellEditableCondition: true,
            cellTemplate: 'passFailTemplate.html',
            editableCellTemplate: 'editablePassFailTemplate.html',
            width: '70%'
        }
    ];

    $scope.load = function () {
        $scope.gridOptions.data = [{
            "id ": "1",
            "name": "2.03",
            "type": "Needs to be Single CLick to edit here",
        }]
    };
    $scope.load();
}]);

...参见plunker

角度ui网格单击editableCellTemplate

0 个答案: