【AngularJS】Controller間で共有可能な値を定義する

AngularJSでは、Controller間で共有可能な値を定義する方法が二通りあります。

• value
• constant

value

valueメソッドを使うことで、Controller間で共有できる値を定義することができます。
定義した値はControllerの引数に設定することで使用可能になります。
FactoryやService内でも同様にして利用可能です。

// 値の定義
angular.module('MyApp',[])
  .value("hogeStr", "hogehoge")
  .value("nHoge", 123)
  .value("isHoge", true)
  .value("hogeObj", {"hoge" : "1", "fuga" : "2"});

// 使用時はControllerの引数に渡す
angular.module('MyApp')
  .controller('MyController', [
    '$scope',
    'hogeStr',
    'nHoge',
    'isHoge',
    'hogeObj',
    function($scope, hogeStr, nHoge, isHoge, hogeObj) {
      console.log(hogeStr);  // hogehoge
      console.log(nHoge);    // 123
      console.log(isHoge);   //  true
      console.log(hogeObj); // {hoge: "1", fuga: "2"}
  }]);

constant

valueメソッド同様に、constantメソッドを使っても共有変数を定義することができます。

// 結果はvalueと同じ
angular.module('MyApp',[])
  .constant("hogeStr", "hogehoge")
  .constant("nHoge", 123)
  .constant("isHoge", true)
  .constant("hogeObj", {"hoge" : "1", "fuga" : "2"})
  .controller('MyController', [
    '$scope',
    'hogeStr',
    'nHoge',
    'isHoge',
    'hogeObj',
    function($scope, hogeStr, nHoge, isHoge, hogeObj) {
      console.log(hogeStr);   // hogehoge
      console.log(nHoge);      // 123
      console.log(isHoge);     //  true
      console.log(hogeObj);  //  {hoge: "1", fuga: "2"}
  }]);

valueとconstantの違い

話が飛びますが、AngularJSはアプリケーションを実行する際configとrunと呼ばれる二つの工程を経由します。

configフェーズではangular.configメソッドを用い、Providerと呼ばれるモジュールの設定変更を行います。 （Providerはサービスの挙動を変更するために用いられます）

configフェーズではまだサービスがインスタンス化されていない状態なので、サービスを機能を利用することができません。 valueもサービスの一種であるため、configフェーズでは使うことはできません。
一方でconstantもサービスの一種なのですが、例外的にconfig内で使用することができます。

そのためconfigフェーズで共有変数を利用したい場合は、必然的にconstantを利用することになります。

じゃあvalueは使う意味ないじゃないかと思うかもしれませんが、
「constantはconfigフェーズでのみ利用する」「valueはrunフェーズ以降で利用する」のように、
各メソッドに意味を与えつつ使い分けるというやり方が可能です。

---

やっぱりconstantだけで良い気がしてきた

参考文献

プロバイダーについて | AngularJS 1.2 日本語リファレンス | js STUDIO