Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Angular DIスキ
Search
Shinichi Kozake
March 20, 2017
Technology
2
1.3k
Angular DIスキ
ng-kyoto Angular Meetup #5
の発表資料です。
Shinichi Kozake
March 20, 2017
Tweet
Share
More Decks by Shinichi Kozake
See All by Shinichi Kozake
アーキテクトとは
kozake
0
1.9k
Ionic React でサービス開発したお話
kozake
0
100
ドキッ!失敗だらけのシステム開発
kozake
1
730
やはり俺のWeb APIは間違えている
kozake
0
450
すごい大規模 たのしく作ろう
kozake
4
2.3k
KHipster ~JHipsterで始めるKotlin Web プログラミング~
kozake
0
790
Docker with JHipster
kozake
1
510
実践JHipster #jsug #sf_36
kozake
2
7.4k
Ionicでアプリ作ったよ!開発方法の紹介
kozake
2
930
Other Decks in Technology
See All in Technology
エンジニアは伝え方が9割/90% of what engineers need is communication skills
ykanoh
2
160
マーケットプレイス版Oracle WebCenter Content For OCI
oracle4engineer
PRO
2
200
XP matsuri 2024 - 銀河英雄伝説に学ぶ
kawaguti
PRO
3
510
スモールスタート、不都合な真実 〜 耳当たりの良い言葉に現場が振り回されないために/20240930-ssmjp-small-start
opelab
13
1.7k
10Xでのデータ基盤の変遷とこれから: データマネジメントのリアル 〜BtoB企業3社の歩みとこれから〜
10xinc
6
1.2k
【shownet.conf_】持続可能な次世代Wi-Fi運用に向けて
shownet
PRO
0
260
リスクから学ぶKubernetesコンテナセキュリティ/k8s-risk-and-security
mochizuki875
1
260
成果のためのコミュニケーション - 語彙を育てよう -/communication-for-good-outcome-developing-vocabulary
hassaku63
4
150
Renovate ではじめる運用レスなライブラリ更新 / 令和最新版 他人に自慢したいヤバいCI/CD LT会 @ yabaibuki.dev #2
ponkio_o
PRO
1
130
k6を活用した再現性・拡張性の高い負荷試験基盤の構築
biwashi
11
2.9k
ドメインと向き合う - 旅行予約編
hidenorigoto
4
520
OPENLOGI Company Profile
hr01
0
53k
Featured
See All Featured
How to Ace a Technical Interview
jacobian
275
23k
StorybookのUI Testing Handbookを読んだ
zakiyama
26
5.1k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
45
4.9k
Side Projects
sachag
452
42k
Six Lessons from altMBA
skipperchong
26
3.4k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
Building Better People: How to give real-time feedback that sticks.
wjessup
360
19k
Fireside Chat
paigeccino
32
2.9k
Being A Developer After 40
akosma
84
590k
How GitHub (no longer) Works
holman
311
140k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
7
560
Statistics for Hackers
jakevdp
796
220k
Transcript
None
#PIWNCT Ⰸⱞשקʙ猳猳獑
NGULAR %* εΩ
ࣗݾհ 5[UVGO#TEJKVGEV 鰄鰇鰂鰈鱄鯵鰒 0COG 鱻鲑鱔鲍鲂ㅕ䃩鰰 #IG 5[UVGO#TEJKVGEV ,QD ,CXC 5MKNN
.KMG
"HFOEB 9JCVņU2TQXKFGT! 9JCVņU1RVKQPCN! 9JCVņU+PLGEVCDNG 9JCVņ+PLGEVQT6TGG
8IBU`T1SPWJEFS 9JCVņU2TQXKFGT! 9JCVņU1RVKQPCN! 9JCVņU+PLGEVCDNG 9JCVņ+PLGEVQT6TGG
2TQXKFGTKU !$PNQPOFOU \ QSPWJEFST<)FSP4FSWJDF> ^ FYQPSUDMBTT)FSPFT$PNQPOFOU\^
!/H.PEVMF \ QSPWJEFST< 6TFS4FSWJDF \QSPWJEF"11@$0/'*( VTF7BMVF)&30@%*@$0/'*(^ > ^ FYQPSUDMBTT"QQ.PEVMF\^ TSDBQQBQQNPEVMFUT TSDBQQIFSPFTIFSPFTDPNQPOFOUUT 鰄鰽 鰄鰽
2TQXKFGTKU +PLGEVQT鯽 *19 9*#6 ͲΜͳτʔΫϯͰ ͲͷΑ͏ʹ +PLGEV鰊鰼鯼鰟崎
2TQXKFGTKU +PLGEVQT鯽 *19 9*#6 ͲͷΑ͏ʹ RTQXKFG WUG%NCUU WUG8CNWG WUG(CEVQT[ WUG'ZKUKVPI
OWNVK +PLGEV鰊鰼鯼鰟崎 ͲΜͳτʔΫϯͰ
WUG%NCUU WUG8CNWG WUG(CEVQT[ WUG'ZKUKVPI 2TQXKFGTKU +PLGEVQT鯽 *19 ͲͷΑ͏ʹ OWNVK +PLGEV鰊鰼鯼鰟崎
9*#6 RTQXKFG ͲΜͳτʔΫϯͰ
DMBTT)FMMP4FSWJDF\ IFMMP)FMMPXPSME ^ !$PNQPOFOU \ TFMFDUPSBQQSPPU UFNQMBUF6SMBQQDPNQPOFOUIUNM QSPWJEFST<)FMMP4FSWJDF>
TUZMF6SMT<BQQDPNQPOFOUDTT> ^ FYQPSUDMBTT"QQ$PNQPOFOU\ DPOTUSVDUPS !*OKFDU )FMMP4FSWJDF QSJWBUFIFMMP)FMMP4FSWJDF \^ UJUMFUIJTIFMMPIFMMP ^ BQQDPNQPOFOUUT 5ZQF サービスをコンポーネントにDIする⼀般的な⽅法が上のコードです。 (コンポーネントにサービスのクラスを書くのはѱ⼿ですが、今回は分かりやすさを優先してここに書いています。) コンポーネントデコレータのprovidersにサービス型を定義し、コンストラクタでそのサービスをインジェクトします。
DMBTT)FMMP4FSWJDF\ IFMMP)FMMPXPSME ^ !$PNQPOFOU \ TFMFDUPSBQQSPPU UFNQMBUF6SMBQQDPNQPOFOUIUNM QSPWJEFST<\QSPWJEF)FMMP4FSWJDF
VTF$MBTT)FMMP4FSWJDF^> TUZMF6SMT<BQQDPNQPOFOUDTT> ^ FYQPSUDMBTT"QQ$PNQPOFOU\ DPOTUSVDUPS !*OKFDU )FMMP4FSWJDF QSJWBUFIFMMP)FMMP4FSWJDF \^ UJUMFUIJTIFMMPIFMMP ^ BQQDPNQPOFOUUT 5ZQF 先ほどのproviders定義は、上のコード指定と同じです。 providでHelloServiceの型をインジェクショントークンとして指定し、インスタンスはHelloServiceクラスから作成することを 指定しています。 QSPWJEFST<)FMMP4FSWJDF> ⛭鰉秷鯵
DMBTT)FMMP4FSWJDF\ IFMMP)FMMPXPSME ^ !$PNQPOFOU \ TFMFDUPSBQQSPPU UFNQMBUF6SMBQQDPNQPOFOUIUNM QSPWJEFST<\QSPWJEF)FMMP4FSWJDF
VTF$MBTT)FMMP4FSWJDF^> TUZMF6SMT<BQQDPNQPOFOUDTT> ^ FYQPSUDMBTT"QQ$PNQPOFOU\ DPOTUSVDUPS !*OKFDU )FMMP4FSWJDF QSJWBUFIFMMP)FMMP4FSWJDF \^ UJUMFUIJTIFMMPIFMMP ^ 5ZQF インジェクショントークンとインジェクトする引の型が同じ場合、Injectデコレータによるトークン指定を省略することがで きます。 䧢䡆⛐聚
DMBTT)FMMP4FSWJDF\ IFMMP)FMMPXPSME ^ !$PNQPOFOU \ TFMFDUPSBQQSPPU UFNQMBUF6SMBQQDPNQPOFOUIUNM QSPWJEFST<\QSPWJEF)FMMP4FSWJDF
VTF$MBTT)FMMP4FSWJDF^> TUZMF6SMT<BQQDPNQPOFOUDTT> ^ FYQPSUDMBTT"QQ$PNQPOFOU\ DPOTUSVDUPS !*OKFDU )FMMP4FSWJDF QSJWBUFIFMMP)FMMP4FSWJDF \^ UJUMFUIJTIFMMPIFMMP ^ BOZ providには型以外も指定できます。 例えば、’HelloService’という⽂字列を指定することも出དྷます。 㡨⸸⓸鰘稊
DMBTT)FMMP4FSWJDF\IFMMP)FMMPXPSME^ DMBTT%*TVLJ4FSWJDF\IFMMP%*TVLJXPSME^ !$PNQPOFOU \ TFMFDUPSBQQSPPU UFNQMBUF6SMBQQDPNQPOFOUIUNM QSPWJEFST<\QSPWJEF)FMMP4FSWJDF VTF$MBTT)FMMP4FSWJDF^
\QSPWJEF)FMMP4FSWJDF VTF$MBTT%*TVLJ4FSWJDF^> TUZMF6SMT<BQQDPNQPOFOUDTT> ^ FYQPSUDMBTT"QQ$PNQPOFOU\ DPOTUSVDUPS !*OKFDU )FMMP4FSWJDF QSJWBUFIFMMP)FMMP4FSWJDF !*OKFDU )FMMP4FSWJDF QSJWBUFIFMMP%*TVLJ4FSWJDF \^ UJUMFA\UIJTIFMMPIFMMP^\UIJTIFMMPIFMMP^A ^ BOZ ただ、⽂字列でインジェクショントークンを指定した場合、同じ⽂字列で別の定義があると、定義が上書きされてしまいます。 複プロバイダによるインジェクショントークンの衝突が⼼配です。 上のコードでは、helloมにはHelloServiceではなく、DIsukiServiceのインスタンスがインジェクトされてしまいました。 鰚鰒鰺鰳&+UWMK猳
DMBTT)FMMP4FSWJDF\IFMMP)FMMPXPSME^ DMBTT%*TVLJ4FSWJDF\IFMMP%*TVLJXPSME^ DPOTU)FMMP5PLFOOFX0QBRVF5PLFO )FMMP4FSWJDF DPOTU)FMMP5PLFOOFX0QBRVF5PLFO )FMMP4FSWJDF !$PNQPOFOU \
TFMFDUPSBQQSPPU UFNQMBUF6SMBQQDPNQPOFOUIUNM QSPWJEFST<\QSPWJEF)FMMP5PLFO VTF$MBTT)FMMP4FSWJDF^ \QSPWJEF)FMMP5PLFO VTF$MBTT%*TVLJ4FSWJDF^> TUZMF6SMT<BQQDPNQPOFOUDTT> ^ FYQPSUDMBTT"QQ$PNQPOFOU\ DPOTUSVDUPS !*OKFDU )FMMP5PLFO QSJWBUFIFMMP)FMMP4FSWJDF !*OKFDU )FMMP5PLFO QSJWBUFIFMMP%*TVLJ4FSWJDF \^ UJUMFA\UIJTIFMMPIFMMP^\UIJTIFMMPIFMMP^\)FMMP5PLFO)FMMP5PLFO^A ^ 0QBRVF5PLFO そのような衝突をさけるҝに、⽂字列のトークンではなくOpaqueTokenを⽤います。 OpaqueTokenは同じ⽂字列でも違うものとして認識されます。 *GNNQ6QMGP*GNNQ6QMGP
RTQXKFG ͲΜͳτʔΫϯͰ 9*#6 2TQXKFGTKU +PLGEVQT鯽 +PLGEV鰊鰼鯼鰟崎 *19 OWNVK WUG%NCUU WUG8CNWG
WUG(CEVQT[ WUG'ZKUKVPI ͲͷΑ͏ʹ
DMBTT)FMMP4FSWJDF\ IFMMP)FMMPXPSME ^ !$PNQPOFOU \ TFMFDUPSBQQSPPU UFNQMBUF6SMBQQDPNQPOFOUIUNM QSPWJEFST<\QSPWJEF)FMMP4FSWJDF
VTF$MBTT)FMMP4FSWJDF^> TUZMF6SMT<BQQDPNQPOFOUDTT> ^ FYQPSUDMBTT"QQ$PNQPOFOU\ DPOTUSVDUPS QSJWBUFIFMMP)FMMP4FSWJDF \^ UJUMFUIJTIFMMPIFMMP ^ VTF$MBTT useClassは値としてクラスを受け取り、Injectのたびにそのクラスのインスタンスを作ります。 Injectのたびにຖ回newです。
DMBTT)FMMP4FSWJDF\IFMMP)FMMPXPSME^ DMBTT%*TVLJ4FSWJDF\IFMMP%*TVLJXPSME^ !$PNQPOFOU \ TFMFDUPSBQQSPPU UFNQMBUF6SMBQQDPNQPOFOUIUNM QSPWJEFST<\QSPWJEF)FMMP4FSWJDF VTF$MBTT%*TVLJ4FSWJDF^>
TUZMF6SMT<BQQDPNQPOFOUDTT> ^ FYQPSUDMBTT"QQ$PNQPOFOU\ DPOTUSVDUPS QSJWBUFIFMMP)FMMP4FSWJDF \^ UJUMFUIJTIFMMPIFMMP ^ VTF$MBTT ちなみに、provideで指定したインジェクショントークンと異なる型のクラスを指定することも出དྷます。 ただし、不必要に混ཚを招くため、このような使⽤⽅法は避けたほうがいいでしょう。 䡑鰛鰼⩬猳猳獑
DMBTT)FMMP4FSWJDF\IFMMP)FMMPXPSME^ DMBTT%*TVLJ4FSWJDFFYUFOET)FMMP4FSWJDF\IFMMP%*TVLJXPSME^ !$PNQPOFOU \ TFMFDUPSBQQSPPU UFNQMBUF6SMBQQDPNQPOFOUIUNM QSPWJEFST<\QSPWJEF)FMMP4FSWJDF VTF$MBTT%*TVLJ4FSWJDF^>
TUZMF6SMT<BQQDPNQPOFOUDTT> ^ FYQPSUDMBTT"QQ$PNQPOFOU\ DPOTUSVDUPS QSJWBUFIFMMP)FMMP4FSWJDF \^ UJUMFUIJTIFMMPIFMMP ^ VTF$MBTT インジェクショントークンの型をܧ承したクラスをuseClassに指定するなどの使⽤⽅法は、型として互換があるので問題ないと 思います。 ⩬鰙鰈鰗ⅳ稰鯽鯳鰼
DMBTT)FMMP4FSWJDF\ DPOTUSVDUPS QSJWBUFOBNFTUSJOH \^ IFMMPA)FMMP\UIJTOBNF^A ^ MFUIFMMP"OHVMBSOFX)FMMP4FSWJDF "OHVMBS !$PNQPOFOU
\ TFMFDUPSBQQSPPU UFNQMBUF6SMBQQDPNQPOFOUIUNM QSPWJEFST<\QSPWJEF)FMMP4FSWJDF VTF7BMVFIFMMP"OHVMBS^> TUZMF6SMT<BQQDPNQPOFOUDTT> ^ FYQPSUDMBTT"QQ$PNQPOFOU\ DPOTUSVDUPS QSJWBUFIFMMP)FMMP4FSWJDF \^ UJUMFUIJTIFMMPIFMMP ^ VTF7BMVF useValueは値としてオブジェクトを受け取り、Injectされるたびにそのࢀ照を渡します。 定のように使えますが、ࢀ照が渡ってくるのでDIされたオブジェクトをม更すると、別の箇所に影響しますので注意が必要で す。 餿䑈鱃䄂鰊
DMBTT)FMMP4FSWJDF\ DPOTUSVDUPS QSJWBUFOBNFTUSJOH \^ IFMMPA)FMMP\UIJTOBNF^A ^ !$PNQPOFOU \ TFMFDUPSBQQSPPU
UFNQMBUF6SMBQQDPNQPOFOUIUNM QSPWJEFST<\QSPWJEF)FMMP4FSWJDF VTF'BDUPSZ OFX)FMMP4FSWJDF "OHVMBS ^> TUZMF6SMT<BQQDPNQPOFOUDTT> ^ FYQPSUDMBTT"QQ$PNQPOFOU\ DPOTUSVDUPS QSJWBUFIFMMP)FMMP4FSWJDF \^ UJUMFUIJTIFMMPIFMMP ^ VTF'BDUPSZ useFactoryの値にはؔを渡します。Injectされるたびにؔが࣮⾏され、そのり値が注⼊されます。 環境によって異なるインスタンスを⽣成したい場合などに、useFactoryを使⽤します。
DMBTT)FMMP4FSWJDF\ DPOTUSVDUPS QSJWBUFOBNFTUSJOH \^ IFMMPA)FMMP\UIJTOBNF^A ^ !$PNQPOFOU \ TFMFDUPSBQQSPPU
UFNQMBUF6SMBQQDPNQPOFOUIUNM QSPWJEFST<\QSPWJEF)FMMP4FSWJDF VTF'BDUPSZ OFX)FMMP4FSWJDF "OHVMBS ^> TUZMF6SMT<BQQDPNQPOFOUDTT> ^ FYQPSUDMBTT"QQ$PNQPOFOU\ DPOTUSVDUPS QSJWBUFIFMMP)FMMP4FSWJDF \^ UJUMFUIJTIFMMPIFMMP ^ VTF'BDUPSZ @armorik83 さんから勉ڧձでご指摘頂きました。ありがとうございます! exportしていないクラスやアローؔ式のFactoryはAoTコンパイルでエラーとなります。 ؾをつけましょう! FYQPSUDMBTT)FMMP4FSWJDF\ DPOTUSVDUPS QSJWBUFOBNFTUSJOH \^ IFMMPA)FMMP\UIJTOBNF^A ^ FYQPSUGVODUJPO)FMMP4FSWJDF'BDUPSZ \ SFUVSOOFX)FMMP4FSWJDF "OHVMBS ^ !$PNQPOFOU \ TFMFDUPSBQQSPPU UFNQMBUF6SMBQQDPNQPOFOUIUNM QSPWJEFST<\QSPWJEF)FMMP4FSWJDF VTF'BDUPSZ)FMMP4FSWJDF'BDUPSZ^> TUZMF6SMT<BQQDPNQPOFOUDTT> ^ GZRQTV鰈鰗鯵鰛鯵鱓鲍鱝鰠#Q6鱗鲗鱵鱈鲏鰘鱌鲍鯮 鱆鲑鯮鏈窚ㇰ鰳#Q6鱗鲗鱵鱈鲏鰘鱌鲍鯮 鰄鰟鰹鯷鰜㧙鰀鰙 鱗鲗鱵鱈鲏蒌鰼
DMBTT)FMMP4FSWJDF\ DPOTUSVDUPS QSJWBUFOBNFTUSJOH \^ IFMMPA)FMMP\UIJTOBNF^A ^ DPOTU)FMMP/BNFOFX0QBRVF5PLFO OBNF !$PNQPOFOU
\ TFMFDUPSBQQSPPU UFNQMBUF6SMBQQDPNQPOFOUIUNM QSPWJEFST<\QSPWJEF)FMMP/BNF VTF7BMVFOHLZPUP^ \QSPWJEF)FMMP4FSWJDF VTF'BDUPSZ OBNFTUSJOH OFX)FMMP4FSWJDF OBNF EFQT<)FMMP/BNF>^> TUZMF6SMT<BQQDPNQPOFOUDTT> ^ FYQPSUDMBTT"QQ$PNQPOFOU\ DPOTUSVDUPS QSJWBUFIFMMP)FMMP4FSWJDF \^ UJUMFUIJTIFMMPIFMMP ^ VTF'BDUPSZ useFactoryを⽤いる場合、depsでインジェクショントークンを指定することが出དྷます。 depsでインジェクショントークンを指定すると、useFactoryのؔにインジェクトした引を渡すことが出དྷます。
DMBTT)FMMP4FSWJDF\ DPOTUSVDUPS QSJWBUFOBNFTUSJOH \^ IFMMPA)FMMP\UIJTOBNF^A ^ !$PNQPOFOU \ TFMFDUPSBQQSPPU
UFNQMBUF6SMBQQDPNQPOFOUIUNM QSPWJEFST<\QSPWJEF)FMMP4FSWJDF VTF'BDUPSZ OFX)FMMP4FSWJDF "OHVMBS ^ \QSPWJEF)FMMP"OHVMBS VTF&YJTUJOH)FMMP4FSWJDF^> TUZMF6SMT<BQQDPNQPOFOUDTT> ^ FYQPSUDMBTT"QQ$PNQPOFOU\ DPOTUSVDUPS !*OKFDU )FMMP"OHVMBS QSJWBUFIFMMP)FMMP4FSWJDF \^ UJUMFUIJTIFMMPIFMMP ^ VTF&YJTUJOH useExistingは値としてインジェクショントークンをとり、それにରするエイリアスを作ります。 つまり異なるインジェクショントークンで同じインスタンスが得られるようになります。 useClassとはਅ逆で、⼀切newしません。 上のコード例の場合、’HelloAngular’の⽂字列トークンでもHelloServiceのインスタンスを得ることが出དྷています。 ┆痓鱃∽㓱
DMBTT)FMMP4FSWJDF\IFMMP)FMMPXPSME^ DMBTT%*TVLJ4FSWJDF\IFMMP%*TVLJXPSME^ !$PNQPOFOU \ TFMFDUPSBQQSPPU UFNQMBUF6SMBQQDPNQPOFOUIUNM QSPWJEFST<\QSPWJEF)FMMP4FSWJDF VTF$MBTT)FMMP4FSWJDF
NVMUJUSVF^ \QSPWJEF)FMMP4FSWJDF VTF$MBTT%*TVLJ4FSWJDF NVMUJUSVF^> TUZMF6SMT<BQQDPNQPOFOUDTT> ^ FYQPSUDMBTT"QQ$PNQPOFOU\ DPOTUSVDUPS !*OKFDU )FMMP4FSWJDF QSJWBUFIFMMP\IFMMPTUSJOH^<> \^ UJUMFA\UIJTIFMMP NBQ PPIFMMP SFEVDF N N N N ^A ^ NVMUJ 通常は同じインジェクショントークンにରして複Providerを宣⾔すると、最後に宣⾔されたものに上書きされますが、multiを trueに指定すると、インジェクショントークンにରして複のProviderを提供することが出དྷます。 この場合、インジェクトされるมの型は配列にします。 苭窚鰛鰟鰘蔥⓸
8IBU`T0QUJPOBM 9JCVņU2TQXKFGT! 9JCVņU+PLGEVCDNG 9JCVņ+PLGEVQT6TGG 9JCVņU1RVKQPCN!
DMBTT)FMMP4FSWJDF\ IFMMP)FMMPXPSME ^ !$PNQPOFOU \ TFMFDUPSBQQSPPU UFNQMBUF6SMBQQDPNQPOFOUIUNM QSPWJEFST<\QSPWJEF)FMMP4FSWJDF
VTF$MBTT)FMMP4FSWJDF^> TUZMF6SMT<BQQDPNQPOFOUDTT> ^ FYQPSUDMBTT"QQ$PNQPOFOU\ DPOTUSVDUPS !*OKFDU "OHVMBS4FSWJDF QSJWBUFIFMMP)FMMP4FSWJDF \^ UJUMFUIJTIFMMPOVMM UIJTIFMMPIFMMPOVMM ^ 0QUJPOBM 依存性解決出དྷなかった場合、DIエラーとなってしまいます。 上のコードの場合、’AngularService’という⽂字列のインジェクショントークンで依存性が解決出དྷなかったので、エラーがൃ ⽣します。 㨋劊鰟鱬鯮鱓鲗
DMBTT)FMMP4FSWJDF\ IFMMP)FMMPXPSME ^ !$PNQPOFOU \ TFMFDUPSBQQSPPU UFNQMBUF6SMBQQDPNQPOFOUIUNM QSPWJEFST<\QSPWJEF)FMMP4FSWJDF
VTF$MBTT)FMMP4FSWJDF^> TUZMF6SMT<BQQDPNQPOFOUDTT> ^ FYQPSUDMBTT"QQ$PNQPOFOU\ DPOTUSVDUPS !0QUJPOBM !*OKFDU "OHVMBS4FSWJDF QSJWBUFIFMMP)FMMP4FSWJDF \^ UJUMFUIJTIFMMPOVMM UIJTIFMMPIFMMPOVMM ^ 0QUJPOBM 依存性解決出དྷなかった場合にもエラーにしたくない場合は、Optionalデコレータで指定します。 こうすることで、依存性解決出དྷなかったมの値がnullとなるだけで、エラーはൃ⽣しません。 VJKUJGNNQ鰟甧鰠PWNN
8IBU`T0QUJPOBM 9JCVņU2TQXKFGT! 9JCVņ+PLGEVQT6TGG 9JCVņU+PLGEVCDNG 9JCVņU1RVKQPCN!
DMBTT8IP\OBNF"OHVMBS^ DMBTT)FMMP4FSWJDF\ DPOTUSVDUPS QSJWBUFXIP8IP \^ IFMMPA)FMMP\UIJTXIPOBNF^A ^ !$PNQPOFOU \ TFMFDUPSBQQSPPU
UFNQMBUF6SMBQQDPNQPOFOUIUNM QSPWJEFST<8IP )FMMP4FSWJDF> TUZMF6SMT<BQQDPNQPOFOUDTT> ^ FYQPSUDMBTT"QQ$PNQPOFOU\ DPOTUSVDUPS QSJWBUFIFMMP)FMMP4FSWJDF \^ UJUMFUIJTIFMMPIFMMP ^ *OKFDUBCMF サービスもDIにより依存性を解決出དྷますが、上のコードはエラーとなります。 理由としては、Injectorで依存性解決可能なクラスとして認識されていないからです。 鱵鲍鲅鯮鱣鱃茭㽛鰘鯾鰛鯵猳
!*OKFDUBCMF DMBTT8IP\OBNF"OHVMBS^ !*OKFDUBCMF DMBTT)FMMP4FSWJDF\ DPOTUSVDUPS QSJWBUFXIP8IP \^ IFMMPA)FMMP\UIJTXIPOBNF^A
^ !$PNQPOFOU \ TFMFDUPSBQQSPPU UFNQMBUF6SMBQQDPNQPOFOUIUNM QSPWJEFST<8IP )FMMP4FSWJDF> TUZMF6SMT<BQQDPNQPOFOUDTT> ^ FYQPSUDMBTT"QQ$PNQPOFOU\ DPOTUSVDUPS QSJWBUFIFMMP)FMMP4FSWJDF \^ UJUMFUIJTIFMMPIFMMP ^ *OKFDUBCMF サービスも依存性解決ର象にしたい場合は、Injectableデコレータを指定します。 Angularでは、すべてのサービスにInjectableデコレータを指定するスタイルが推されています。 なお、ComponentでInjectableが必要なかった理由は、ComponentやDirective、Pipeは、Injactableのサブタイプだからで す。
8IBU`T0QUJPOBM 9JCVņU2TQXKFGT! 9JCVņU1RVKQPCN! 9JCVņU+PLGEVCDNG 9JCVņ+PLGEVQT6TGG
*OKFDUPS5SFF ∼Rangle's Angular Training Book [The Injector Tree] よりൈਮ∼ AngularのInjectorはコンポーネントツリーとฒ⾏してツ
リーを形成します。 Injectorはすべてのコンポーネントຖに作成されるわけでは なく、デコレータでprovidersが指定されたコンポーネント ຖに作成され、Injector Treeを形成します。 コンポーネントは⾃分⾃⾝、もしくは⾃分の親のコンポーネ ントのInjectorをたどることで、依存性解決を解決します。 Injectorຖにインスタンスはシングルトンなので、その⼦コ ンポーネントは親と同じインスタンスをࢀ照します。
·ͱΊ 9JCVņU2TQXKFGT! 9JCVņU1RVKQPCN! 9JCVņU+PLGEVCDNG 9JCVņ+PLGEVQT6TGG ͍ΖΜͳϑϨϯζ͕͍ΔΑʂΘʙ͍ʂͨͷ͠ʙ͍ʂʂ (((ο( ƅ˜ƅ*)ο)))
5IBOLZPVBMM GPSMJTUFOJOH (((ο( ƅ˜ƅ*)ο)))