Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

Angular DIスキ

Avatar for Shinichi Kozake Shinichi Kozake
March 20, 2017
Technology
1.4k
2

Angular DIスキ

ng-kyoto Angular Meetup #5
の発表資料です。

Avatar for Shinichi Kozake

Shinichi Kozake

March 20, 2017

More Decks by Shinichi Kozake

See All by Shinichi Kozake
アーキテクトとは
Avatar for Shinichi Kozake kozake
0
2.5k
Ionic React でサービス開発したお話
Avatar for Shinichi Kozake kozake
0
200
ドキッ！失敗だらけのシステム開発
Avatar for Shinichi Kozake kozake
1
890
やはり俺のWeb APIは間違えている
Avatar for Shinichi Kozake kozake
0
590
すごい大規模 たのしく作ろう
Avatar for Shinichi Kozake kozake
4
2.7k
KHipster ~JHipsterで始めるKotlin Web プログラミング~
Avatar for Shinichi Kozake kozake
0
980
Docker with JHipster
Avatar for Shinichi Kozake kozake
1
620
実践JHipster #jsug #sf_36
Avatar for Shinichi Kozake kozake
2
8k
Ionicでアプリ作ったよ！開発方法の紹介
Avatar for Shinichi Kozake kozake
2
1.1k

Other Decks in Technology

See All in Technology
Adaptive Warehouse を今すぐ導入すべき理由と迷ったときの判断基準
Avatar for あれ __allllllllez__
0
190
Claude Code本って、 読む必要あるの？
Avatar for Oikon oikon48
2
410
Microsoft 365 Copilot chat -tekoälypalvelun tietosuojaongelmat
Avatar for Harto Pönkä hponka
0
720
プロダクト思考 × 基盤思考を AIで実現する Compound Engineering
Avatar for Watanabe Takeshi(Buzz) tkc66buzz
1
320
越境するなら専門用語を使うな高校校歌 / If you wanna cross border, you shouldn't use jargon
Avatar for VTRyo vtryo
0
120
Slack上でインフラをトラブルシュートする！ Agentic Platform Engineeringの第一歩
Avatar for teru0x1 teru0x1
4
1.1k
AIに丸投げしないトイル削減 / Eliminating Toil Without Leaving It All to AI
Avatar for kohbis kohbis
4
1.1k
GoCon2026 - Open Source, Open World
Avatar for sanposhiho sanposhiho
4
3.3k
コーディングエージェントでM5Stack系の開発を少し試した時の話 / M5 Japan Tour 2026 Autumn 東京
Avatar for you（@youtoy） you
PRO
0
170
「重なり」は迎える側がつくる ― 人もAIエージェントも歓迎するプロダクトエンジニアリング ―
Avatar for Go Akazawa go0517go
PRO
0
280
ペアプロの価値はコードを書くことだけじゃない
Avatar for コドモン開発チーム codmoninc
PRO
0
190
Snowflakeで実現する全社横断の顧客の声（VOC）分析・活用基盤@Snowflake World Tour Tokyo 2026
Avatar for yuto16 yuto16
0
190

Featured

See All Featured
A designer walks into a library…
Avatar for Paul Jervis Heath pauljervisheath
211
25k
How To Speak Unicorn (iThemes Webinar)
Avatar for Michelle Schulp Hunt marktimemedia
1
570
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
Avatar for Eileen M. Uchitelle eileencodes
28
3.6k
Jamie Indigo - Trashchat’s Guide to Black Boxes: Technical SEO Tactics for LLMs
Avatar for Tech SEO Connect techseoconnect
PRO
0
660
VelocityConf: Rendering Performance Case Studies
Avatar for Addy Osmani addyosmani
331
25k
Have SEOs Ruined the Internet? - User Awareness of SEO in 2025
Avatar for Akash Hashmi akashhashmi
0
500
What Being in a Rock Band Can Teach Us About Real World SEO
Avatar for Ade Holder 427marketing
0
1.1k
Art, The Web, and Tiny UX
Avatar for Lynn Fisher lynnandtonic
304
22k
Making Projects Easy
Avatar for Brett Harned brettharned
120
6.7k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
Avatar for Morgane Peng morganepeng
133
19k
Leveraging LLMs for student feedback in introductory data science courses - posit::conf(2025)
Avatar for Mine Cetinkaya-Rundel minecr
1
380
職位にかかわらず全員がリーダーシップを発揮するチーム作り / Building a team where everyone can demonstrate leadership regardless of position
Avatar for MADOX madoxten
69
65k

Transcript

  1. None

  2. #PIWNCT Ⰸⱞש؃׵קʙ猳猳獑

  3. NGULAR %* εΩ

  4. ࣗݾ঺հ 5[UVGO#TEJKVGEV 鰄鰇鰂鰈鱄鯵鰒 0COG 鱻鲑鱔鲍鲂⹻ㅕ䃩鰰 #IG 5[UVGO#TEJKVGEV ,QD ,CXC 5MKNN

    .KMG

  5. "HFOEB 9JCVņU2TQXKFGT! 9JCVņU1RVKQPCN! 9JCVņU+PLGEVCDNG 9JCVņ+PLGEVQT6TGG

  6. 8IBU`T1SPWJEFS 9JCVņU2TQXKFGT! 9JCVņU1RVKQPCN! 9JCVņU+PLGEVCDNG 9JCVņ+PLGEVQT6TGG

  7. 2TQXKFGTKU !$PNQPOFOU \  QSPWJEFST<)FSP4FSWJDF>   ^  FYQPSUDMBTT)FSPFT$PNQPOFOU\^

    !/H.PEVMF \  QSPWJEFST< 6TFS4FSWJDF  \QSPWJEF"11@$0/'*( VTF7BMVF)&30@%*@$0/'*(^ >   ^  FYQPSUDMBTT"QQ.PEVMF\^ TSDBQQBQQNPEVMFUT TSDBQQIFSPFTIFSPFTDPNQPOFOUUT 鰄鰽 鰄鰽

  8. 2TQXKFGTKU +PLGEVQT鯽 *19 9*#6 ͲΜͳτʔΫϯͰ ͲͷΑ͏ʹ +PLGEV鰊鰼鯼鰟崎⹻

  9. 2TQXKFGTKU +PLGEVQT鯽 *19 9*#6 ͲͷΑ͏ʹ RTQXKFG WUG%NCUU WUG8CNWG WUG(CEVQT[ WUG'ZKUKVPI

    OWNVK +PLGEV鰊鰼鯼鰟崎⹻ ͲΜͳτʔΫϯͰ

  10. WUG%NCUU WUG8CNWG WUG(CEVQT[ WUG'ZKUKVPI 2TQXKFGTKU +PLGEVQT鯽 *19 ͲͷΑ͏ʹ OWNVK +PLGEV鰊鰼鯼鰟崎⹻

    9*#6 RTQXKFG ͲΜͳτʔΫϯͰ

  11. DMBTT)FMMP4FSWJDF\ IFMMP)FMMPXPSME ^ !$PNQPOFOU \ TFMFDUPSBQQSPPU  UFNQMBUF6SMBQQDPNQPOFOUIUNM  QSPWJEFST<)FMMP4FSWJDF>

     TUZMF6SMT<BQQDPNQPOFOUDTT> ^  FYQPSUDMBTT"QQ$PNQPOFOU\ DPOTUSVDUPS !*OKFDU )FMMP4FSWJDF QSJWBUFIFMMP)FMMP4FSWJDF \^ UJUMFUIJTIFMMPIFMMP ^ BQQDPNQPOFOUUT 5ZQF サービスをコンポーネントにDIする⼀般的な⽅法が上のコードです。 （コンポーネントにサービスのクラスを書くのはѱ⼿ですが、今回は分かりやすさを優先してここに書いています。） コンポーネントデコレータのprovidersにサービス型を定義し、コンストラクタでそのサービスをインジェクトします。

  12. 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> ⛭鰉秷鯵

  13. 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デコレータによるトークン指定を省略することがで きます。 䧢䡆⛐聚

  14. 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’という⽂字列を指定することも出དྷます。 㡨⸸⓸鰘稊⹻

  15. 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猳

  16. 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

  17. RTQXKFG ͲΜͳτʔΫϯͰ 9*#6 2TQXKFGTKU +PLGEVQT鯽 +PLGEV鰊鰼鯼鰟崎⹻ *19 OWNVK WUG%NCUU WUG8CNWG

    WUG(CEVQT[ WUG'ZKUKVPI ͲͷΑ͏ʹ

  18. 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です。

  19. 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で指定したインジェクショントークンと異なる型のクラスを指定することも出དྷます。 ただし、不必要に混ཚを招くため、このような使⽤⽅法は避けたほうがいいでしょう。 䡑鰛鰼⩬猳猳獑

  20. 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に指定するなどの使⽤⽅法は、型として互換があるので問題ないと 思います。 ⩬鰙鰈鰗ⅳ稰鯽鯳鰼

  21. 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されたオブジェクトをม更すると、別の箇所に影響しますので注意が必要で す。 餿䑈鱃䄂鰊

  22. 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を使⽤します。

  23. 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鱗鲗鱵鱈鲏鰘鱌鲍鯮 鰄鰟鰹鯷鰜㧙鰀鰙 鱗鲗鱵鱈鲏蒌鰼

  24. 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のؔ਺にインジェクトした引਺を渡すことが出དྷます。

  25. 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のインスタンスを得ることが出དྷています。 ┆痓鱃∽㓱

  26. 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を提供することが出དྷます。 この場合、インジェクトされるม਺の型は配列にします。 苭窚鰛鰟鰘蔥⓸

  27. 8IBU`T0QUJPOBM 9JCVņU2TQXKFGT! 9JCVņU+PLGEVCDNG 9JCVņ+PLGEVQT6TGG 9JCVņU1RVKQPCN!

  28. 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’という⽂字列のインジェクショントークンで依存性が解決出དྷなかったので、エラーがൃ ⽣します。 㨋⹻劊鰟鱬鯮鱓鲗

  29. 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

  30. 8IBU`T0QUJPOBM 9JCVņU2TQXKFGT! 9JCVņ+PLGEVQT6TGG 9JCVņU+PLGEVCDNG 9JCVņU1RVKQPCN!

  31. 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で依存性解決可能なクラスとして認識されていないからです。 鱵鲍鲅鯮鱣鱃茭㽛鰘鯾鰛鯵猳

  32. !*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のサブタイプだからで す。

  33. 8IBU`T0QUJPOBM 9JCVņU2TQXKFGT! 9JCVņU1RVKQPCN! 9JCVņU+PLGEVCDNG 9JCVņ+PLGEVQT6TGG

  34. *OKFDUPS5SFF ∼Rangle's Angular Training Book [The Injector Tree] よりൈਮ∼ AngularのInjectorはコンポーネントツリーとฒ⾏してツ

    リーを形成します。 Injectorはすべてのコンポーネントຖに作成されるわけでは なく、デコレータでprovidersが指定されたコンポーネント ຖに作成され、Injector Treeを形成します。 コンポーネントは⾃分⾃⾝、もしくは⾃分の親のコンポーネ ントのInjectorをたどることで、依存性解決を解決します。 Injectorຖにインスタンスはシングルトンなので、その⼦コ ンポーネントは親と同じインスタンスをࢀ照します。

  35. ·ͱΊ 9JCVņU2TQXKFGT! 9JCVņU1RVKQPCN! 9JCVņU+PLGEVCDNG 9JCVņ+PLGEVQT6TGG ͍ΖΜͳϑϨϯζ͕͍ΔΑʂΘʙ͍ʂͨͷ͠ʙ͍ʂʂ (((ο( ƅ˜ƅ*)ο)))

  36. 5IBOLZPVBMM GPSMJTUFOJOH (((ο( ƅ˜ƅ*)ο)))