Question

我在我的控制器中定义了一个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()需要什么？

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

Answer 1

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

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

Answer 2

感谢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
         }

   }

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

2 个答案: