angular.jsをやってみる (6) - service -

2014-03-17T00:00:00+00:00 angular.js JavaScript

provider同様にserviceを使ってオブジェクトを注入する方式を利用する事もできる。で似たようなのでfactoryっていうのもあるけど、angular.jsをやってみる (1)でやってるのでそこはパス。無論、「serviceとfactoryの違い」に関しては後述するので

app.js

angular.module("app", [])
  .service("sample", function() {
    this.say = function() {
      alert("hoge");
    };
  })
  .controller("SampleController", function(sample) {
    // hogeがalertされる
    sample.say();
  });

っていう感じ。ちなみにserviceで指定しているfunctionでオブジェクトを返すとそれが注入される。で今回なぜthis.sayをfunction作ってやってるのかっていうのは後述している「serviceとfactoryの違い」に関しているので

serviceとfactoryの違い

参考からコピペすると

  • service: 渡したfunctionをコンストラクタとしてインスタンスを生成し、そのインスタンスをサービスに登録する。
  • factory: 渡したfunctionをfunctionのままサービスに登録する。

っていう事らしい。要はserviceだと引数に指定しているfunction自体がコンストラクタになるような形になるので、そこにメソッドなりを定義すれば良い。factoryだとオブジェクトを返してそれをproviderとして登録するような仕組みになっている模様。ちなみに$injector.instantiateが使われているかどうかの違いっぽい(詳しくはソースの該当する部分を読めば良い)

参考: [Angular.js]factoryとserviceの使い分けについて

angular.jsをやってみる (7) - route - angular.jsをやってみる (5) - provider -