角js ui網格雙擊行不起作用

Question

我想在ui-grid行的doubleclick上調用函數myFunc。 為此，我已經使用

<ng-dblclick="grid.appScope.myFunc()">

但是它沒有被調用並且沒有顯示錯誤。

這是html的調用部分：

<div ui-grid="gridOptions" ui-grid-selection class="gridStyle" 
    ng-dblclick="grid.appScope.myFunc()">
</div>

這是js腳本：

    var myData = [{name: "Moroni", age: 50},
                        {name: "Tiancum", age: 43},
                        {name: "Jacob", age: 27},
                        {name: "Nephi", age: 29},
                        {name: "Enos", age: 34}];

          var app = angular.module('myApp', ['ui.grid', 'ui.grid.selection']);
          app.controller('MainCtrl', function($scope) {
                 $scope.data = myData;
                 $scope.mySelections = [];

                 $scope.gridOptions = {
                     data :'data',
                     selectedItems : $scope.mySelections,
                     enableRowSelection: true,
                     //enableSelectAll: true,
                     selectionRowHeaderWidth: 35,
                     rowHeight: 35,
                     showGridFooter:true,
                     enableRowHeaderSelection :false,
                     multiSelect:false,
                     enableSelectAll:false,
                     enableFullRowSelection:true,
                   //  noUnselect: true
                 }


$scope.myFunc = function ()
                         {
                       alert('you double clicled!');
                          };



                    .
                    .
                    .
                    .

      });

Answer 1

指令名稱中的錯字。

它應該是

ng-dblclick="grid.appScope.myFunc()"

代替

ngdblclick="grid.appScope.myFunc()"

Answer 2

應該這樣做：

 var app = angular.module('app', ['ui.grid', 'ui.grid.selection']); app.controller('MainCtrl', ['$scope', function($scope) { var dblClickRowTemplate = //same as normal template, but with ng-dblclick="grid.appScope.myFunc()" "<div ng-repeat=\\"(colRenderIndex, col) in colContainer.renderedColumns track by col.uid\\" ng-dblclick=\\"grid.appScope.myFunc()\\" ui-grid-one-bind-id-grid=\\"rowRenderIndex + '-' + col.uid + '-cell'\\" class=\\"ui-grid-cell\\" ng-class=\\"{'ui-grid-row-header-cell': col.isRowHeader }\\" role=\\"{{col.isRowHeader ? 'rowheader' : 'gridcell'}}\\" ui-grid-cell></div>"; $scope.gridOptions = { rowTemplate: dblClickRowTemplate, //selectedItems: $scope.mySelections, enableRowSelection: true, //enableSelectAll: true, selectionRowHeaderWidth: 35, rowHeight: 35, showGridFooter: true, enableRowHeaderSelection: false, multiSelect: false, enableSelectAll: false, enableFullRowSelection: true, data: [{name: "Moroni", age: 50}, {name: "Tiancum", age: 43}, {name: "Jacob", age: 27}, {name: "Nephi", age: 29}, {name: "Enos", age: 34}] } $scope.myFunc = function() { alert('you double clicled!'); }; }]); 

 <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-grid/4.0.2/ui-grid.min.js"></script> <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/angular-ui-grid/4.0.2/ui-grid.min.css" /> <div ng-app="app" ng-controller="MainCtrl"> <div ui-grid="gridOptions" ui-grid-selection class="gridStyle"> </div> </div> 

如果您還有其他問題，請告訴我。