AngularJS ES6 中的组件

Question

我在 ES6 中创建了一个 AngularJS 组件，如下所示：

import template from 'template.html'

class ctrler {
  constructor ($scope, $cordovaDevice) {
    $scope.title = 'This is from component'
    this.$scope = $scope
    document.addEventListener('deviceready', this.onDeviceReady)
  }

  onDeviceReady() {
    console.log(this.$scope)
  }

  $onDestroy () {
    document.removeEventListener('deviceready', this.onDeviceReady)
    console.log('ctrler onDestroy');
  }
}

const cpnt = {
  template: template,
  controller: ctrler
}

export { cpnt }

我的问题是 $scope 和 $cordovaDevice 是 constructor(){} 中的局部参数，但我希望它们成为全局参数，所以我使用 this.$scope = scope，它是不工作。

我该怎么做？

Answer 1

实际上，$scope不是局部参数，而是全局参数。

onDeviceReady()函数是事件监听的回调函数，所以this.$scope表示不是ctrler.$scope，就是这个问题。

感谢您的回复并阅读我的问题。

祝你有美好的一天。

Answer 2

我很确定问题在于您如何将回调传递给 document.addEventListener()。您需要通过在传入方法时添加对 bind(this) 的调用来将 this 绑定到控制器的上下文。

试试这个：

document.addEventListener('deviceready', this.onDeviceReady.bind(this));

执行此操作时，this.$scope 将在执行回调时正确引用 ctrler 的 this.$scope。

AngularJS ES6 中的组件

AngularJS component in ES6

javascript

angularjs

ecmascript-6

ngcordova