Kątowa komórka edycji UI-grid na przycisku Kliknij - angularjs, angular-ui-grid, ui-grid

Używam Angular wraz z UI-Grid (http://ui-grid.info/)

Skonfigurowałem siatkę za pomocą poniższych opcji

this.mdGridLogOptions.gridOptions= {
enableSorting: false,
enableColumnMenus: false,
enableAutoFitColumns: false,
paginationPageSizes: [25, 50, 100, 200, 500],
enableFiltering: true,
enableGridMenu: false,
enableCellEditOnFocus: true,
columnDefs: [
{
field: "override_date",enableCellEdit:true,
displayName: "PROMISE DATE", type: "date",
cellFilter: "date:"MMM-dd-yyyy"",
cellTemplate:"<div class="ui-grid-cell-contents" layout="row" layout-align="space-between end"><div>{{COL_FIELD CUSTOM_FILTERS}}</div><div ng-click="grid.appScope.clickHandler()" class="material-icons md-light">event</div></div>",
editableCellTemplate: "<div uigriddatepicker ng-class="colt + col.uid"></div>"}}

Pole pokazuje się prawidłowo, jak poniżej. Mam kilka problemów

1. Do edycji pola służy tylko dwukrotne kliknięcie. Rozumiem, że editcellonfocus jest opcją, ale nie działa zgodnie z przeznaczeniem, ponieważ nie mogę wyłączyć podwójnego kliknięcia
2. Chcę rozpocząć proces edycji, klikając przycisk kalendarza i wyłączając przycisk podwójnego kliknięcia. Czy zdarzenie strzelania POCZĄTEK jest dla komórki macierzystej?

Odpowiedzi:

jeśli użyjemy celltemplate, pojedyncze zdarzenie click do edycji nie działa. spróbuj w inny sposób pokazać swoje dane zamiast używać celltemplate.i myślę, że mamy dyrektywę cellfilter użyj poniższego linku http://brianhann.com/6-ways-to-take-control-of-how-your-ui-grid-data-is-displayed/

Chciałem zrobić dzisiaj to samo, wygląda na to, że nie ma „normalnego” sposobu, aby to zrobić, trzeba symulować zdarzenie „dblclick” w komórce, które trzeba rozpocząć edycję.

Więc najpierw w swoim cellTemplate musisz wysłać „wiersz” jako parametr do funkcji obsługi kliknięć.

 ng-click="grid.appScope.clickHandler(row)"

później w ClickHandler musisz znaleźć indeks klikniętego wiersza, a następnie pobrać element html komórki, którą chcesz rozpocząć edycję.

  scope.clickHandler = function(row){
// this is a hack to make possible editing on cell by button click
// get the row index of the clicked element
var rowIndex = row.grid.renderContainers.body.visibleRowCache.indexOf(row);
// then get the jqLite element of the cell that needs to be edited
var el = angular.element(document.querySelectorAll(".ui-grid-row")[rowIndex].children[0].children[0]);
// simulate double click on the cell to start editing
el.triggerHandler("dblclick");
};