ES6类使用bind vs call调用类中的方法？

我有一个用ES6编写的类，我有一个指令“action”，它需要访问一个名为“selected”的控制器值。 此控制器值“选定”由另一个指令“网格”更新。 （双向绑定）

我需要将已经由指令“网格”更新的控制器中的“选定”值传递给指令“操作”。 我试图通过做一个“绑定”，但我得到一个类型错误，因为“不能读取未定义的actionHandler”

我不知道处理这个问题的最好方法是什么，这样当“网格”指令更新“选定”值时，actionEvent会使用来自控制器的更新值来触发。 指令正常工作，我能够看到它在断点处断开。

这是我在HTML中的

<div class="col-xs-9">          
   <action options="ctrl.Actions" on-select="ctrl.actionEvent">
   </action>
</div>
<div class="col-xs-12">
  <grid config="ctrl.gridOptions" data="ctrl.data" selected="ctrl.selected"></grid>
 </div>

在控制器中，

 class CheckC {
   constructor($scope) {
    this.$scope = $scope;       
    this.selected = this.$scope.selected;
  }

actionEvent() {
    this.actionHandler.bind(this);
}

actionHandler(item, event) {
    let selection;
    let model = this.selected;
    if(model) {
        item.id = 1;
    }
 }
 }

---

首先，不要混淆.bind()和.call() 。

首先返回一个新的函数实例，可以稍后调用，但保留了this 。

第二个电话马上发挥作用，但修改的情况下this只是本次通话。

阅读此答案以获取更多信息

您正在传递对actionEvent方法的引用。 在调用的那一刻，对原始控制器对象的引用已经丢失。

为了保存引用，你需要首先在构造函数中保存它

class CheckC {
  constructor($scope) {
    this.$scope = $scope;       
    this.selected = this.$scope.selected;
    //bind method here
    this.actionEvent = this.actionEvent.bind(this);
  }

  actionEvent(item, event) {
    // this here will be always contain a referene to class instance
    this.actionHandler(item, event);
  }

  actionHandler(item, event) {
    let selection;
    let model = this.selected;
    if(model) {
      item.id = 1;
    }
  }
}

同样在你的代码中， actionEvent方法似乎是多余的。 考虑重构代码并直接传递actionHandler 。 （不要忘记更新.bind()调用，它应该绑定actionHandler之后）。

链接地址: http://www.djcxy.com/p/97003.html

上一篇: ES6 class calling a method within a class with bind vs call?

下一篇: Ways to break JavaScript Scope