web-dev-qa-db-ja.com

異なるモジュールから同じ名前の2つのAngularJSサービスを使用するにはどうすればよいですか?

AngularJS用に2つのモジュールがあるとします。 foobarであり、どちらもbazというサービスを定義しています。

私のアプリケーションでは、次のように言ってそれらに依存しています。

var app = angular.module('app', [ 'foo', 'bar' ]);

次に、を使用してコントローラーでbazサービスを使用してみることができます。

app.controller('blaController', [ '$scope', 'baz', function($scope, baz) {
  // ...
}]);

2つのサービスのどちらを使用するかを定義するにはどうすればよいですか?完全修飾名などはありますか?

27
Golo Roden

サービスロケーターは名前でサービスを検索します( angularjsガイドDI )。ただし AngularJSの「名前空間」サービス

現在、AngularJSはサービスの名前空間の衝突を処理しないため、同じ名前のサービスを持つ2つの異なるモジュールがあり、両方のモジュールをアプリに含めると、使用できるサービスは1つだけになります。

完全修飾名は「手作業で」作成できると思います。サービスに名前を付けますfoo.bazおよびbar.bazプレーンなbazの代わりに。それは一種の自己妄想です。さらに、このように記述しても名前空間は現実的ではありませんが、コードを読む別の人がそう思うかもしれません。

38
Eduard Gamonal

同じ名前のサービスが2つある場合は、ローカルモジュールで使用するときにそれらを区別する必要があります。それがどのように機能するかを理解するために、以下のいくつかのコードを見てみましょう、

2つのUtilサービスがあり、それらを区別する必要があります。

angular
  .module('module1', [
  ])
  .service('UtilService', UtilService)
  .service('another.UtilService', UtilService)
  .name;

コントローラファイルでは、以下のように簡単に挿入できます。

export class Controller {
  public static $inject: string[] = ['UtilService', 'another.UtilService'];

constructor(
    private utilService: UtilService,
    private anotherUtilService
  ) {
     console.log(this.utilService) // will print the main util service methods
     console.log(this.anotherUtilService) // will print the another util service 
     methods
  }
0