gridApi.edit.on.afterCellEdit 使用 ES6

Question

我正在使用 es6 与 angular 1.5 和 ui.grid。在网格 api 上注册 afterCellEdit 事件时，我应该传递什么而不是 $scope？

export default class MyController{
// other codes skipped
registerGrdApi(gridApi) {
        this.grdApi = gridApi;
        gridApi.edit.on.afterCellEdit(this, this.afterCellEdit);
}

afterCellEdit(rowEntity, colDef, newVal, oldVal){
    // this.window.console.log(oldVal+" is changed to "+newVal);
}
}

我们通常传递 this，因为 MyController class 是当前范围，但我收到以下错误。

asked to listen on edit.on.afterCellEdit but scope wasn't passed in the input parameters.  It is legitimate to pass null, but you've passed something else, so you probably forgot to provide scope rather than did it deliberately, not registering

正如上面错误消息中所建议的，当我使用 null 时如下所述

gridApi.edit.on.afterCellEdit(null, this.afterCellEdit);

每当我在网格上执行一些编辑时，它都会出现以下错误，我在这里缺少什么？

TypeError: Cannot read property 'apply' of undefined

Answer 1

在注入 MyController 时通过 $scope 时问题已解决。稍后在 onRegisterApi 函数中使用该变量。下面是有效的代码。

`

export default class MyController{
// constructor
MyController($scope){
    this.scope = $scope;
    this.gridOptions = {
    columnDefs: this.colDefs,
    data: this.gridData,
    enableFiltering: true,
    appScopeProvider: this,
    onRegisterApi: this.registerGrdApi,
    };
}
// other codes skipped
registerGrdApi(gridApi) {
    this.grdApi = gridApi;
    var _self = this.appScopeProvider;
    gridApi.edit.on.afterCellEdit(_self.scope, _self.afterCellEdit);
}
afterCellEdit(rowEntity, colDef, newVal, oldVal){
    // this.window.console.log(oldVal+" is changed to "+newVal);
}
}
MyController.$inject = ['$scope'];

`

gridApi.edit.on.afterCellEdit 使用 ES6

gridApi.edit.on.afterCellEdit using ES6

angularjs

ecmascript-6

ui-grid