ngGrid雙擊一行打開彈出窗口以編輯一行

Question

我將如何去實現ng-Grid中的雙擊事件？更具體地說，我想雙擊打開彈出式模態（Angular UI Modal）進行編輯。

有關如何做到這一點的任何想法？

Answer 1

我不知道，但是這可能會幫助你， http://plnkr.co/edit/SUQnUhX0wyi9UDMc4Vpl?p=preview

Answer 2

從關於該問題的評論的鏈接通過@ AardVark71 Add Doubleclick Behavior to ng-grid

以下Javascript的文件從您的應用程序添加到一些目錄訪問並且不要忘記在啓動過程中加載它。

/* 
DoubleClick row plugin 
*/ 

function ngGridDoubleClick() { 
    var self = this; 
    self.$scope = null; 
    self.myGrid = null; 

    // The init method gets called during the ng-grid directive execution. 
    self.init = function(scope, grid, services) { 
     // The directive passes in the grid scope and the grid object which 
     // we will want to save for manipulation later. 
     self.$scope = scope; 
     self.myGrid = grid; 
     // In this example we want to assign grid events. 
     self.assignEvents(); 
    }; 
    self.assignEvents = function() { 
     // Here we set the double-click event handler to the header container. 
     self.myGrid.$viewport.on('dblclick', self.onDoubleClick); 
    }; 
    // double-click function 
    self.onDoubleClick = function(event) { 
     self.myGrid.config.dblClickFn(self.$scope.selectedItems[0]); 
     self.$scope.$apply(); 
    }; 
} 

定義一個函數來處理雙擊和更新網格選項，如下所示：

$scope.myDblClickHandler = function(rowItem) { 
// rowItem is actually the entity of the row ... 
} 

$scope.gridOptions = { 
    // other config here... 
    dblClickFn: $scope.myDblClickHandler, 
    plugins: [ngGridDoubleClick] 
} 

此功能並不一定是在$範圍這個工作。

Answer 3

在NG-電網2.0.11，做一個簡單的調用到NG-DBLCLICK指令行的模板

$scope.gridOptions = { 
    data: 'gdDtA', 
    rowTemplate: '<div ng-dblclick="foo(row)" ng-style="{\'cursor\': row.cursor, \'z-index\': col.zIndex() }" ng-repeat="col in renderedColumns" ng-class="col.colIndex()" class="ngCell {{col.cellClass}}" ng-cell></div>',   
}; 

$scope.foo = function(r) { 
    console.log(r); 
} 

見：https://github.com/angular-ui/ng-grid/wiki/Templating