Angularjs 带ES6级和巴别塔的角度服务

我试图将ES6类用作角度服务，但当它被实例化时，这些方法无法访问构造函数变量

class dataWrapperService {

    constructor($q, $log) {
        this.$q = $q;
        this.$log = $log;
    }

    data() {
        console.log(this.$q);
    }
}

dataWrapperService.$inject = ['$q', '$log'];

app.service('dataWrapper', dataWrapperService);

一旦Angular注入了服务，并且我对其调用了data方法，该方法就无法访问构造函数值

// calling the data method results in an error
dataWrapper.data();   //TypeError: Cannot read property '$q' of undefined

//  console.log output of dataWrapper:
Object
  $log: Object
  $q: Q(resolver)
  __proto__: smDataWrapperService
    constructor: smDataWrapperService($q, $log)
    data: data()
    __proto__: Object

但是

我可以手动新建dataWrapperService，效果很好

var dataWrapper = new smDataWrapperService("hello", "sir");
dataWrapper.data();   // "hello"

我错过了什么

更新：

---

这似乎只发生在promise回调中：

我通常将函数传递给然后/catch，如下所示：

$http.get('whatever').then(dataWrapper.data);

但只有以下几点才能起作用：

$http.get('whatever').then((response) => smDataWrapper.data(response))

---

Angular需要在

app.factory（'dataWrapper'，dataWrapperService）中使用函数而不是类

您可以将静态工厂方法添加到类中，并将其添加到
app.factory
。
（请参阅下面的更新代码片段）

这样的代码应该可以工作：

class dataWrapperService {

    constructor($q, $log) {
        this.$q = $q;
        this.$log = $log;
    }

    data() {
        console.log(this.$q);
    }

    static dataWrapperFactory($q, $log) {
        dataWrapperService.instance = new dataWrapperService($q, $log);
        return dataWrapperService.instance;
    }
}

dataWrapperService.$inject = ['$q', '$log'];

app.factory('dataWrapper', dataWrapperService.dataWrapperFactory);

更新

正如注释中提到的，您的代码应该可以工作，因为ES6类是一个构造函数，这正是
angular.service
所期望的

我稍后会检查您的代码是否存在任何其他问题。
我知道这已经很晚了，但可能有人会像我今天一样遇到类似问题，因此

事实上，这与承诺无关。执行此操作时：

let function1 = () => {}
let function2 = function1

实际上，
这个
对象对于函数是不同的。因此，当您尝试
。然后（function1）
，实际上
function1
正在被复制到参数
successCallback
，并且它是
此
已更改

但是当您使用
。然后（（）=>function1（））
，
successCallback
接收您的lambda，并且
function1
的实际
不会丢失

因此，如果您不知道，您所做的是什么，从不在javascript中为函数分配函数，使用lambdas代替Angular 1.6.4中的
，当我尝试在某个控制器中注入定义为类的服务时，会出现错误

无法将类作为函数调用

因此，我想使用函数作为服务。为了尽可能保持干净，我将导出一个函数，该函数立即返回一个实例化的匿名类。并在单独的文件中执行此操作，然后导入并使用该函数在另一个文件中创建服务

由于您要求将ES6与Babel一起使用，请使用在导出函数上方添加
'/*@ngInject*/'
来安全地注入依赖项

注入的服务
$q
和
$log
或通过闭包提供给类。（无需将它们传递到构造函数中并分配给此。）

我以为angular.service接受了一个构造函数并对其调用了“new”？是的，对不起，你是对的。我的代码是工厂代码。我会纠正的。我不知道你的代码怎么了。我在你的代码中看到过很多这样做的例子，似乎只有承诺才能做到。更新了上面的示例。这是不安全的，在js Minify中无法生存。如果要将“服务类”方法分配给控制器函数，请像
$scope.isLoggedIn=（）=>{Auth.isLoggedIn（）；}，而不是
$scope.isLoggedIn=Auth.isLoggedIn。否则，
此
将指向控制器本身，而不是类。谢谢你的眼睛开窍剂。@arcol我花了几个小时试图弄明白，很高兴我能让别人免受这种痛苦
// dataWrapperService.js
/* @ngInject */
export const dataWrapperService = ($q, $log) => new class {
  constructor() {
    // do stuff
  }

  data() {
    // $q available through closure
    console.log($q)
  }
}()

// in your.module.js
import angular from 'angular'

import { dataWrapperService } from './dataWrapperService'

export const YourModule = angular
  .module('yourmodule', [])
  .factory('dataWrapper', dataWrapperService)
  .name