AngularJS 1.6 + ES6 - 将jquery ui-grid回调数据返回给控制器[duplicate]

Posted 2021-04-14

这个问题在这里已有答案：

• How to access the correct `this` inside a callback? 10个答案

我在我的控制器中定义了一个jquery ui-grid组件，其简化示例如下所示：

class myController {
    constructor($scope) {        

        this.$scope = $scope; 

        this.Grid = {                               

            selectionSettings:{
                clientHandler:function(key,object,data){
                    console.log(key);
                    console.log(object);
                    console.log(data);                    
                    console.log(this);
                    return data;                        
                    //the scope of this function is different from the controller scope.                          
                    }              
           }
       }

       receiver(data){
             doSomething(data);
       }
    ...

我的想法是，当我在网格中选择一个条目时，会触发clientHandler中的函数。然后，我希望此函数将该数据传递给此类中的接收器函数。

但由于这个clientHandler函数和receiver()在不同的范围内，我无法直接使用this关键字。

stackoverflow上的其他答案建议使用$scope对象来完成相同的操作，但我无法这样做。

使clientHandler函数调用receiver()需要什么？

任何指导都受到热烈欢迎。谢谢

答案

ES6箭头函数用于提供词汇this并避免使用self = this技巧，这在ES6中通常是不必要的：

clientHandler: (key,object,data) => {
  this.receiver(data);   
}  

另一答案

感谢Adelin的单挑

这是最终的工作代码：

class dashboardController {
    constructor(dashboardService, $scope) {
        this.$scope = $scope;      

        var self = this;

        this.Grid = {

            selectionSettings:{                
               clientHandler:function(key,object,data){
                   self.receiver(data);                 
            }                
        }

        receiver(data){
             this.selected = data;
             this.$scope.$apply(); //to propagate the change to the UI, if needed
         }

   }