Angular.jsのvalueとfactoryの違いを考える
次のようなHTMLがあったとする。
[code language=”html”]
<!doctype html>
<html lang="jp" ng-app="App">
<head>
<meta charset="utf-8">
<script src="bower_components/angular/angular.js"></script>
<script src="app.js"></script>
</head>
<body>
<div ng-controller="Ctrl">
Value:{{answer}}
</div>
</body>
</html>
[/code]
valueとfactoryの違いを考える
valueもfactoryもcontrollerから利用する値やfunctionを登録しておくのに使う。そのようなcontrollerの外部に登録されているfunction等をサービスと呼ぶ。たとえば、下記のようにplusやminusといったサービスがあったとする。
[code language=”js”]
angular.module(‘App’,[])
.value(‘plus’, function(a,b){ return a+b; }) //plusサービス
.value(‘minus’, function(a,b){ return a-b; }) //minusサービス
.controller(‘Ctrl’,
["$scope", "plus", "minus",
function($scope, plus, minus){
$scope.answer = minus(plus(3,2),1); // 4
}
]
);
[/code]
下記のように、plusとminusを組み合わせたplus_minusというサービスを作りたいが、plus_minus内からplusやminusは参照することができない。
[code language=”js”]
angular.module(‘App’,[])
.value(‘plus’, function(a,b){ return a+b; })
.value(‘minus’, function(a,b){ return a-b; })
.value(‘plus_minus’,function(a,b,c){
return minus(plus(a,b),c); // minusやplusが参照できない
})
.controller(‘Ctrl’,
["$scope", "plus_minus",
function($scope, plus_minus){
$scope.answerValue = plus_minus(3,2,1); // エラー
}
]
);
[/code]
このように、登録されているサービスを利用するときにfactoryを使う。
[code language=”js”]
angular.module(‘App’,[])
.value(‘plus’, function(a,b){ return a+b; })
.value(‘minus’, function(a,b){ return a-b; })
.factory(‘plus_minus’, ["plus","minus",function(plus, minus){ // ここで明示的に参照
return function(a,b,c){
return minus(plus(a,b),c);
};
}])
.controller(‘Ctrl’,
["$scope", "plus_minus",
function($scope, plus_minus){
$scope.answer = plus_minus(3,2,1); // 4
}
]
);
[/code]
次回は factoryとserviceの違いを考える。
関連記事
-
-
【未経験からのRuby on Rails – 第１回】楽しく書けるプログラミング言語 “Ruby” とは
こんにちは、はじめまして。新卒１年目のmatsuari（女子）です。 この度、Rubyの勉強を始めることになりまして、 まずはたくさんあるプログラミング言語の中で、なぜ自分がRubyを学ぶのか？ しっかりと把握した上で学習に取り組んでいきたいと考え、『Rubyとは何か？』調べました。 超基礎的なこと …
-
-
D3.jsとその活用事例について
D3.jsとは？ D3とは「Data Driven Document」の略で、データに基づいてドキュメントを操作するための JavaScript ライブラリです。 ご存知の方も多いと思いますが、ちょっとだけD3.jsの基本的な使い方、そして弊社プラットフォームでの利用についてご紹介したいと思います。 …
-
-
読み方がわからない技術用語 2015
英語圏での読み方を基本的には参考にしています。英語圏でも複数の読み方をしているケースもあるようなので、あくまでも参考程度。2015と書きながら、古い言葉も混じってますが。 async – えーしんく Alt – おると ASUS – えいすーす bower  …
-
-
Android 非同期処理についてまとめてみた
Androidには、UIに影響を与えないよういくつか非同期処理が用意されています。 今回は非同期処理の代表的な ・Service ・IntentService ・HandlerThread について違いを踏まえながらまとめます！ 非同期処理について(http://codezine.jp/articl …
-
-
【未経験からのRuby on Rails – 第3回】変数と定数
こんにちは。新卒1年目のmatsuariです。 今回はRubyに限らずプログラミングを学ぶ上で非常に重要となる「変数と定数」について、ご紹介していきます。 変数とは・・・ オブジェクトを一時的に格納しておく箱で、オブジェクトを識別するために利用します。 言葉だけでは理解が難しいかと思いますので、まず …
-
-
【未経験からのRuby on Rails – 第2回】Rubyのプログラムを書いてみる（Mac）
こんにちは。新卒1年目のmatsuariです。 前回はRubyとは何か、簡単にご紹介をしましたが、 今回は実際にRubyファイルを作成して、プログラムを書いてみるところまでご紹介していけたらと思います。 Mac環境のプログラミング初心者向けです。 はじめに、Rubyのプログラムを書くためのファイルを …
-
-
ナイーブベイズで羽生さんと羽生くんを分類してみた
はじめに こんにちは。システム開発部の中村です。 機械学習についての理解を促進するため、 データから分類モデルを自動で構築する古典的な方法である、 ナイーブベイズ分類器を実装してみました。 最近はCloudVisionAPIなど専ら画像解析が流行っていますが、 自分のような初学者には敷居が高そうだっ …
-
-
PyStanによるはじめてのマルコフ連鎖モンテカルロ法
はじめに こんにちは。システム開発部の中村です。 社内で行っている『データ解析のための統計モデリング入門』(所謂緑本)の輪読会に参加した所、 大変わかりやすい本だったものの、Macユーザには悲しい事に実装サンプルがWinBUGSだったため、 9章の一般化線形モデルのベイズ推定によるアプローチをPyt …
-
-
TypeScriptについてまとめてみた
はじめに JavaScript がとりあえずそのまま動くので、雰囲気で使ってしまいがちな TypeScript。初心者向けに基本的なことをまとめてみました。 TypeScript って何？ TypeScript はマイクロソフトが開発したプログラミング言語で、オープンソースでメンテナンスされています …
-
-
Scala入門 準備編「開発環境構築」 – PHP使いからScala使いへ転身！
はじめに みなさんこんにちは、今月入社しましたプロダクト開発本部の亀梨です。 普段はXmediaOneというメディアプランニング・広告運用管理・トラッキング・マーケティング分析を行う 統合プラットフォームの開発を担当しています。 XmediaOneの開発で採用しているプログラム言語はS …
- PREV
- Treasure Dataで長期間の集計
- NEXT
- 【動画広告】VASTって何？