AngularJSでDIを必要とする状態を持つオブジェクトを生成する

Angular ではなく、未だに AngularJS と戦う同志に捧ぐ。

以下のような service で実装された ServiceA ServiceB に依存し、かつ状態を持つオブジェクトをAngularJSで実装するためのテクニックの共有です。

class ModelA {
  constructor(ServiceA, ServiceB, state) {
    this.ServiceA = ServiceA;
    this.ServiceB = ServiceB;

    this.state = state;
  }
}

AngularJSの提供する service factory はシングルトンオブジェクトを返す仕組なので状態を持つオブジェクトの生成には利用できません。
仕方なくコントローラーに該当オブジェクトの生成に必要な依存オブジェクトをDIしてコントローラー内で生成するという方法しかできません。
画面数、component数が多いとコントローラーに膨大な依存オブジェクトのDIの記述が並び、重複したコードが至るところに出現してメンテナンス性を下げます。

以下のような service を導入することでこの問題を解決することができます。
上記の ModelA を必要なコントローラーは FactoryService をDIして createModelA 関数を実行すれば ModelA のインスタンスを生成して利用できます。

class FactoryService {
  constructor(ServiceA, ServiceB) {
    'ngInject';
    this.ServiceA = ServiceA;
    this.ServiceB = ServiceB;
  }

  createModelA(state) {
    return new ModelA(this.ServiceA, this.ServiceB, state);
  }
}

app.service('FactoryService', FactoryService);

この実装パターンの利点は文脈に応じたインスタンス生成が実現できることです。
インスタンス生成の関数に文脈を表現する引数を追加することで生成するインスタンスを複数の候補から選択することができるよになります。