s e a r c h S e a r c h L o g i n S i g n u p
(一) T r e n d (二) Q i i t a E n g i n e e r F e s t a 2 0 2 4 (三) Q u e s t i o n (四) O f f i c i a l E v e n t (五) O f f i c i a l C o l u m n (六) s i g n p o s t C a r e e r (七) O r g a n i z a t i o n
33 G o t o l i s t o f u s e r s w h o l i k e d 36 m o r e _ h o r i z i n f o M o r e t h a n 5 y e a r s h a v e p a s s e d s i n c e l a s t u p d a t e . @ Q u r a m y ( Y o s u k e K u r a m i ) A n g u l a r J S で 拡 張 ポ イ ン ト を 持 つ S e r v i c e を 作 成 す る . ● J a v a S c r i p t ● A n g u l a r L a s t u p d a t e d a t 2 0 1 6 - 1 1 - 2 9 P o s t e d a t 2 0 1 4 - 0 8 - 1 1
は じ め に
こ の エ ン ト リ は ﹁ " 利 用 者 側 が 設 定 を 変 更 可 能 な " A n g u l a r の S e r v i c e の 作 成 方 法 に つ い て ﹂ で あ る . 以 下 の よ う な A n g u l a r J S の S e r v i c e が あ っ た と し よ う . m y M o d u l e . j s var module = angular . module ( ' myModule ' , []);
module . factory ( ' myService ' , function (){
var message = ' Hello, world ' ;
return {
hello : function (){
return message ;
}
};
});
↓ の よ う に イ ン ジ ェ ク シ ョ ン す れ ば 、 h e l l o ( ) が 利 用 で き る ( 何 の 面 白 み も な い ) S e r v i c e だ a p p . j s var app = angular . module ( ' myApp ' , [ ' myModule ' ]);
app . controller ( ' MainCtrl ' , [ ' $scope ' , ' myService ' , function ( $scope , myService ){
$scope . message = myService . hello ();
}]);
こ こ で 、 h e l l o ( ) が 返 す メ ッ セ ー ジ を ア プ リ ケ ー シ ョ ン の モ ジ ュ ー ル 毎 に 設 定 出 来 る 用 に し た い と す る .
サ ー ビ ス プ ロ バ イ ダ の 利 用 .
モ ジ ュ ー ル の 利 用 者 側 か ら 設 定 可 能 な S e r v i c e と し た い 時 は 、 $ p r o v i d e . p r o v i d e r を 利 用 す る .
な ん ぞ そ れ 、 と い う 人 も い る か も で あ る が 、 先 ほ ど の コ ー ド で f a c t o r y で あ っ た と こ ろ を 少 し イ ジ る 程 度 だ . m y M o d u l e . j s var module = angular . module ( ' myModule ' , []);
module . provider ( ' myService ' , function (){
var opt = { message : ' Hello, world ' };
this . configure = function ( options ){
opt = angular . extend ( opt , options );
};
this . $get = function (){
return {
hello : function (){
return opt . message ;
}
};
};
});
ポ イ ン ト は p r o v i d e r を 利 用 し て い る と こ ろ と 、 t h i s . . . の 辺 り . p r o v i d e r の 使 い 方 は お も に 下 記 で あ る ‥ ●
p r o v i d e r は サ ー ビ ス プ ロ バ イ ダ の コ ン ス ト ラ ク タ を 引 数 と し て セ ッ ト す る . ● サ ー ビ ス プ ロ バ イ ダ の コ ン ス ト ラ ク タ は 、 $ g e t メ ソ ッ ド を 実 装 し な く て は な ら な い ( こ い つ が 無 い 場 合 、 A n g u l a r が エ ラ ー を 吐 く ) . ●
$ g e t メ ソ ッ ド は 関 数 で あ り 、 A n g u l a r の D I ( $ i n j e c t ) 経 由 で イ ン ジ ェ ク シ ョ ン さ れ る 際 に 呼 び 出 さ れ る 関 数 を 実 装 す る ( f a c t o r y ( . . . ) で セ ッ ト し て い た 関 数 と 同 様 の 位 置 づ け ) m o d u l e の p r o v i d e r は A n g u l a r の S e r v i c e 登 録 に お い て 、 最 も プ リ ミ テ ィ ブ な 関 数 で あ る .
$ p r o v i d e . f a c t o r y や $ p r o v i d e . v a l u e , $ p r o v i d e . s e r v i c e は 、 全 て $ p r o v i d e . p r o v i d e r の ラ ッ パ に 過 ぎ な い . さ て 、 利 用 側 は ↓ の よ う に 、 ポ イ ン ト は 、 c o n f i g [ " ( サ ー ビ ス 名 ) + P r o v i d e r " ] と す る こ と で 、 モ ジ ュ ー ル 側 で 作 成 し た サ ー ビ ス プ ロ バ イ ダ の コ ン ス ト ラ ク タ に ア ク セ ス す る こ と が 出 来 る . a p p . j s var app = angular . module ( ' myApp ' , [ ' myModule ' ]);
app . config ([ ' myServiceProvider ' , function ( myServiceProvider ){
myServiceProvider . configure ({
message : ' My name is Quramy! '
});
}]);
app . controller ( ' MainCtrl ' , [ ' $scope ' , ' myService ' , function ( $scope , myService ){
$scope . message = myService . hello ();
}]);
A n g u l a r J S 本 体 で も 、 サ ー ビ ス プ ロ バ イ ダ 経 由 で 、 利 用 者 に S e r v i c e の 設 定 を 行 う 口 を 提 供 す る パ タ ー ン は 多 い た め 、 下 記 等 で 目 に し た こ と も あ る の で は な い だ ろ う か . ● A j a x ( $ h t t p ) と $ h t t p P r o v i d e r . i n t e r c e p t o r ● n g R o u t e に お け る $ r o u t e P r o v i d e r . w h e n ● e t c . . .
補 足 ・ 豆 知 識
● サ ー ビ ス プ ロ バ イ ダ に ア ク セ ス 可 能 な の は 、 m o d u l e . c o n f i g の み で あ る .
● A n g u a r J S の ア プ リ ケ ー シ ョ ン が 開 始 さ れ て か ら は 、 サ ー ビ ス プ ロ バ イ ダ に ア ク セ ス す る こ と は 出 来 な い . ● 逆 に 、 ア プ リ ケ ー シ ョ ン を 開 始 し て か ら の S e r v i c e の 挙 動 変 更 を 許 し た い の で あ れ ば 、 m o d u l e . v a l u e と m o d u l e . r u n の 組 み 合 わ せ を 考 慮 し た 方 が よ い . ●
m o d u l e . c o n f i g に は 、 サ ー ビ ス プ ロ バ イ ダ と m o d u l e . c o n s t a n t で 定 義 し た 定 数 の み が イ ン ジ ェ ク シ ョ ン 可 能 .
●
$ i n j e c t o r と $ p r o v i d e は 例 外 的 に イ ン ジ ェ ク シ ョ ン 可 能 . ● S e r v i c e 自 体 の イ ン ス タ ン ス 生 成 が 実 行 さ れ て い な い タ イ ミ ン グ で 、 m o d u l e . c o n f i g が 走 る 、 と い う 意 味 . ●
m o d u l e . c o n f i g の 設 定 は 、 m o d u l e . _ i n v o k e Q u e u e に 登 録 さ れ て い き 、 こ の 順 序 に 従 っ て 実 行 さ れ る .
● ( や る 価 値 が あ る か は 別 と し て ) ` a n g u l a r . m o d u l e ( ' n g ' ) . _ i n v o k e Q u e u e を イ ジ る と 、 A n g u l a r J S 本 体 の 組 み 込 み モ ジ ュ ー ル の プ ロ バ イ ダ 登 録 よ り 早 い タ イ ミ ン グ で 処 理 を 挟 み 込 む こ と も 出 来 る .
参 考
● h t t p s : / / d o c s . a n g u l a r j s . o r g / g u i d e / p r o v i d e r s # p r o v i d e r s _ p r o v i d e r - r e c i p e 33 G o t o l i s t o f u s e r s w h o l i k e d 36 c o m m e n t 0 G o t o l i s t o f c o m m e n t s R e g i s t e r a s a n e w u s e r a n d u s e Q i i t a m o r e c o n v e n i e n t l y (一) Y o u g e t a r t i c l e s t h a t m a t c h y o u r n e e d s (二) Y o u c a n e f f i c i e n t l y r e a d b a c k u s e f u l i n f o r m a t i o n (三) Y o u c a n u s e d a r k t h e m e W h a t y o u c a n d o w i t h s i g n i n g u p S i g n u p L o g i n 33 G o t o l i s t o f u s e r s w h o l i k e d 36 m o r e _ h o r i z
H o w d e v e l o p e r s c o d e i s h e r e . G u i d e & H e l p C o n t e n t s S N S O u r s e r v i c e C o m p a n y
@Qiita
@Qiita
Our service
Qiita Team
Qiita Zine
Official Shop
Company
About Us
Careers
Qiita Blog