角度Ui網格模糊事件不會觸發

Question

我正在使用Angular UI-Grid v3.0.4。我正在使用columndef單元格模板來獲取所需的定製，如下所示（我在模板中有ng-blur事件和方法）。

$scope.gridOptions = { 
      showColumnFooter: true, 
      columnDefs: [ 
         { 
          name: "SalesAmount", displayName: "Sales Amount" 
         }, 
         { 
          name: "CommissionAmount", displayName: "Commission Amount", enableCellEdit: true, enableCellEditOnFocus: true, 
          cellTemplate: '<input type="text" ng-model="row.entity.pddCommissionAmount" ng-blur="updateEntitys(row.entity)"></input>' 
         } 

         ] 
        }; 

ng-blur事件不會觸發其執行。研究並添加一個自定義ngblur指令，看看是否有幫助

app.directive('ngBlur', function() { 
    return function (scope, elem, attrs) { 
     elem.bind('blur', function() { 
      scope.$apply(attrs.ngBlur); 
     }); 
    }; 
}); 



$scope.updateEntitys = function (row) { 
      alert("Update Entitys within ngblur event"); 
     } 

這似乎不工作。非常感謝任何幫助。

Answer 1

我不太瞭解ui-grid，但我相當肯定，爲什麼它不起作用的原因是，所謂的「cellTemplate」中的html永遠不會被編譯，因爲它實際上並不是角模板。我相信你可以使用$compile找到解決方法，將html傳遞給cellTemplate，同時將對象保存到某個變量，但我也認爲這將是一種令人難以置信的方式來做你想做的事（不管是什麼？）。

相反，我認爲你應該看看有關編輯功能的UI網格文件：http://ui-grid.info/docs/#/tutorial/201_editable

我認爲這是你真正想要的東西：

$scope.gridOptions.onRegisterApi = function(gridApi) { 
    $scope.gridApi = gridApi; 
    gridApi.edit.on.afterCellEdit($scope, function(rowEntity, colDef, newValue, oldValue) { 
    console.log('edited row id:' + rowEntity.id + ' Column:' + colDef.name + ' newValue:' + newValue + ' oldValue:' + oldValue); 
    $scope.$apply(); 
    }); 
}; 

http://plnkr.co/edit/GJfBpn0kIkhgrPAPUYSb?p=preview