最初AngularJSってscopeがすごい便利だな〜!って思って使っていたが、
Controllerを作っていくと次第に同じような処理を色々と書いている自分に気づいた。
そこでAngularJSの提供するServiceについて学習したことのまとめを書く。ちなみに参考文献は以下
市販されているAngularJSに関してで一番詳しく書いてある本だと思う。
今のところ日本語版は出てないので、あとはDocumentを読むくらいしかない。
Service を作る factory と provider の違い
Serviceを作るにはserviceというそのまんまのメソッドが提供されているが、これは自分で一からクラスを作らないといけなかったりで割と使いにくい。
AngularJSではfactoryとproviderの2つがよく使われるそうだ。
結論から言うとまずは「標準ではfactory, 細かな初期設定が必要な場合はproviderを使う」と覚えておけばいいと思う。
factory の例(参考物件より抜粋)
angular.module('app', ['engines']).controller('AppCtrl', function ($scope, car) {
car.start();
}).factory('car', function ($log, dieselEngine) {
return {
start: function() {
$log.info('Starting ' + dieselEngine.type);
}
};
});angular.module('engines', [])
.factory('dieselEngine', function () {
return {
type: 'diesel'
};
});
ここでわかることを挙げる。
- controller の第二引数に作成したservice 名を追加し、Controller内で定義したメソッドが使える
- factory はオブジェクトを返し、値でもメソッドでも定義できる(今回はtype文字列のみ)
- angular.module で分割できるが、外部のmoduleで定義したserviceを利用するには、呼び出し元のangular.module の第二引数に配列でmodule名を指定する
もちろんController内にメソッドを定義できるが、それだとController内でしかメソッドが使えないので、必要に応じてServiceをDIしてメソッドを使えるようにする。
さらにこうするとテストが書きやすくなるので、積極的に外部Serviceとして切り出していくほうがいいらしい。
provider の例
angular.module('app', []).controller('AppCtrl', function ($scope, car) {
car.start();
}).provider('car', function () {
var config = {
maxLen: 4
};return {
setMaxLen: function(len) {
config.maxLen = len;
},
$get: function($log) {
return {
start: function() {
$log.info('maxlen: ' + config.maxLen);
}
};
}
};
})
.config(function(carProvider) {
carProvider.setMaxLen(10);
}) ;
ここでわかることを挙げる。
- provider には必ず$getメソッドを持つオブジェクトを返す必要がある。($getメソッドの戻り値がサービスのオブジェクトとなる)
- provider直下のconfigは、privateフィールドになる。
- config (function(carProvider))... で初期設定ができる。ここがfactoryとの違い
- configのprovider名の引数はサービス名+Providerの命名規則になっている模様
providerは初期設定とプライベート変数、メソッドが定義できることがfactoryとの違いで、より柔軟な定義ができるようになる、というイメージ。
そして最も大きな違いは・・・
それは angular の config フェーズの時に Provider はDI できるが、 Factory はできない、と言う点だ。RouteProvider がいい例ではあるが、アプリ全体の設定をしたい、という時は Provider を使わないと実現できない。逆に Controller での処理を分けたい、というのであれば Factory を利用する。
この本のお陰でよくわかった!