Angularjs 面向对象服务和es6

只是想知道是否有人在angular中有任何“面向对象”服务的模式/方法。我指的是一个服务，它基本上创建了一个类，该类创建了自身的“实例”：

function MyService(injectedServiceA, injectedServiceB) {
  return function MyService(arg1, arg2 ... ) {
     var var1 = arg1;

     this.someFunction() {
        ... do something with var1 ...
     }
  }
}

并注入：

angular.module('MyModule', []).service('MyService', MyService);

angular.module('MyModule', []).service('MyServiceMaker', MyServiceMaker);

然后，该服务可以提供给控制器，控制器可以创建该服务的实例：

$scope.myService = new MyService(arg1, arg2 ... );

视图使用

someFunction

我采取了这种（幼稚的？）方法，但不起作用：

class MyService {
  {
    constructor(arg1, arg2 ... ) {
      this._var1 = arg1;
    }

    someFunction() {
        ... do something with this._var1 ...
    }
  }
}

class MyServiceMaker {
  constructor(injectedServiceA, injectedServiceB);
  make(arg1, arg2 ... ) { return new MyService(arg1, arg2 ...); }
}

并注入：

angular.module('MyModule', []).service('MyService', MyService);

angular.module('MyModule', []).service('MyServiceMaker', MyServiceMaker);

然后在控制器中：

 $scope.myService = MyServiceMaker.make(arg1, arg2 ... );

---

这构造得非常好，等等。但是当在myService上调用我的someFunction时，

this

是未定义的

主要有两种模式

使用服务：

export default class NameService {
  constructor($q) {
    this._$q = $q
  }

  getName() {
    return this._$q.when("Bobby Tables")
  }
}


angular.module('myApp', [])
  .service('NameService', ['$q', NameService])

export default class NameFactory {
  constructor($q) {
    this._$q = $q
  }

  getName() {
    return this._$q.when("Bobby Tables")
  }
}



angular.module('myApp', [])
  .factory('NameService', ['$q', ($q) => new NameService($q)])

使用工厂：

export default class NameService {
  constructor($q) {
    this._$q = $q
  }

  getName() {
    return this._$q.when("Bobby Tables")
  }
}


angular.module('myApp', [])
  .service('NameService', ['$q', NameService])

export default class NameFactory {
  constructor($q) {
    this._$q = $q
  }

  getName() {
    return this._$q.when("Bobby Tables")
  }
}



angular.module('myApp', [])
  .factory('NameService', ['$q', ($q) => new NameService($q)])

---

这是一篇讨论Angular 1.x和ES6中的服务的好文章：

没有理由将

MyServiceMaker

创建为一个类。原始示例中的外部

函数MyService

从来都不是类，也不应该是类

去买吧

angular.module('MyModule', []).service('MyService', makeMyService);
function makeMyService(injectedServiceA, injectedServiceB) {
  return class MyService {
    constructor(arg1, arg2 ... ) {
      var var1 = arg1;
      this.someFunction = function() {
        …
      }
    }
    … // further prototype methods
  }
}

或者，如果您想使用更多ES6功能，可以使用箭头函数，而不是声明

makeMyService

：

angular.module('MyModule', []).service('MyService', (injectedServiceA, injectedServiceB) =>
  class MyService {
    constructor(arg1, arg2 ... ) {
      this._var1 = arg1;
    }
    someFunction() {
      …
    }
  }
);

---

您可以在哪一行显示更多的代码来抛出错误吗？我假设它是someFunc你怎么调用someFunc的？您不能复制myService.someFunc的引用并从视图中调用它。啊，很抱歉，我添加了这部分代码。同样，我也同意，我自己正在举例说明这一点，这确实非常糟糕。。。虽然，我不知道还有什么办法可以做到？即使在es5版本中，我自己也在实例化它（只是使用

new

语法而不是我自己愚蠢的maker类），那么工厂呢？你可以通过angular service注册并正确注入它？您可能想了解这是什么意思。您如何定义类看起来很好，您的问题可能是如何使用它。为什么服务应该创建自己类的实例，而不是另一个类的实例。这会让事情变得不那么混乱，你也不会失去任何东西。这就是您在第二个示例中所做的，它应该可以正常工作。如果它导致了问题，那么发布真正的代码并解释问题是什么。是的，我基本上尝试按照博客文章中的说明操作——但问题是创建一个可以创建自身实例的服务，我不这么认为addresses@hiroprotagonist服务在设计上应该是单例的。为什么要创建它们的多个实例？为什么要创建工厂，它可以是

.service（'NameService'，NameService）

，并通过静态

$inject

，

构造函数（private\uq）注释DEP{

etc..@PSL您可以这样做。在服务上使用工厂提供了关于返回内容的语义值。作为应用程序的架构师，它是您的调用。@agconti工厂不是为类而设计的，这就是服务的用途。当您在具有模块模式等的函数中创建自己的实例时使用它。实际上，在您共享的e link本身pete已经提到了它：

实际上，尝试通过module.factory（）方法来注册类是没有意义的。只需使用module.service（）即可相反。

。OP在这方面做得很好。是的，这比拥有maker类要好得多。虽然这会迫使我在匿名函数中定义类吗？是的，因为你想在类方法中使用注入的依赖项（参数），不是吗？