使用依赖注入实例化 Class 常量

Question

我们使用 angular 常量来定义类。我怎样才能使 Class 常量在实例化时可以在构造函数中有一个参数，但也有依赖注入？我的思路是这样的：

ClassA.js

class ClassA { ... }

angular.module("myApp").constant("ClassA", ClassA);

ClassB.js

class ClassB {
  constructor(constrParams, ClassA) { // mix of constructor parameter and DI
    this.constrParams = constrParams;
    this.ClassA = ClassA;
  }
}

ClassB.$inject = ["ClassA"]; // ClassB needs reference to ClassA
angular.module("myApp").constant("ClassB", ClassB);

在另一个常量中导入 ClassB 时，我还能这样做吗

ClassC.js

class ClassC {
  constructor(ClassB) {
    this.classBinst = new ClassB("myparams"); // instantiate new ClassB instance
  }
}

ClassC.$inject = ["ClassB"];
angular.module("myApp").constant("ClassC", ClassC);

Answer 1

如果您想手动传递任何构造函数参数，我认为您必须手动传递它们。

所以 ClassC 也必须将 ClassA 作为参数传递给 ClassB:

class ClassC {
  constructor(ClassB, ClassA) {
    this.classBinst = new ClassB("myparams", ClassA); // instantiate new ClassB instance
  }
}

但是如果你创建需要 ClassC 的 ClassD，你就会遇到同样的问题 - 需要传入 ClassC 及其所有依赖项（ClassB 和 ClassA).

但是如果 ClassC 是最终级别并且可以作为单例实例化和注入，那么您可以创建一个实例化 ClassC 的服务，而不必担心它的依赖关系：

angular.module("myApp").service('instanceC', ClassC);

angular.module("myApp").controller('myController', function (instanceC) {
    // Everything has been resolved
});

也许您最好创建一个服务来为您创建这些类的实例。该服务可以解决类需要的依赖关系并手动传递它们，而控制器可以传递任何自定义参数：

class factory {
    constructor(ClassA, ClassB, ClassC) {
        this.ClassA = ClassA;
        this.ClassB = ClassB;
        this.ClassC = ClassC;
    }

    createB(customParamForClassB) {
        return new this.ClassB(customParamForClassB, this.ClassA)
    }
}

angular.module("myApp").service('factory', factory);

angular.module("myApp").controller('myController', function (factory) {
    let instanceB = factory.createB('myparams');
});

Answer 2

我扩展了 Frank 提供 classes 作为服务的想法，但改用工厂结构。工厂提供可以直接实例化的 class 定义，而不是在服务中显式创建函数。格局如下：

ClassA.js

class ClassA { ... }

angular.module("myApp").factory("ClassA", () => ClassA);

ClassB.js

class ClassB {
  constructor(constrParams) {
    this.constrParams = constrParams;
    // this.ClassA reference is already injected through factory
  }
}

angular.module("myApp")
.factory("ClassB", ["ClassA", (ClassA) => {
  // this is where dependency injection happens
  ClassB.prototype.ClassA = ClassA;
  return ClassB; // class definition
}]);

ClassC.js（最终目标 - 与之前相同）

class ClassC {
  constructor() {
    // instantiate new ClassB instance
    this.classBinst = new this.ClassB("myparams");
  }
}

angular.module("myApp").factory("ClassC", ["ClassB", (ClassB) => {
  ClassC.prototype.ClassB = ClassB;
  return ClassC;
}]);

相关模式：Correct way of wrapping javascript class in AngularJS module and inject angular services

使用依赖注入实例化 Class 常量

Instantiate Class constant with dependency injection

javascript

constants

angularjs

ecmascript-6

es6-class