鹿海 發表於 2019-10-8 19:56:00

typedi 强大的javascript以及typescript 依赖注入框架

<p>typedi 是typestack团队提供的依赖注入解决方案,对于typescript 我们可以使用注解的开发方式,官方的文档也比较详细</p>
<h2 id="javascript使用">javascript 使用</h2>
<ul>
<li>基于函数的服务注入</li>
</ul>
<div id="wiz_cm_1570535671864_7820" class="wiz-code-container" data-mode="JavaScript" data-theme="default">
<div class="CodeMirror cm-s-default" data-id="wiz_cm_1570535671864_7820">
<div class="CodeMirror-scroll">
<div class="CodeMirror-sizer">
<div>
<div class="CodeMirror-lines">
<div>
<div class="CodeMirror-code">
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">var <span class="cm-def">Service <span class="cm-operator">= <span class="cm-variable">require(<span class="cm-string">"typedi").<span class="cm-property">Service;</span></span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">var <span class="cm-def">Container <span class="cm-operator">= <span class="cm-variable">require(<span class="cm-string">"typedi").<span class="cm-property">Container;</span></span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">var <span class="cm-def">PostRepository <span class="cm-operator">= <span class="cm-variable">Service(() <span class="cm-operator">=&gt; ({</span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-property">getName() {</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-keyword">return <span class="cm-string">"hello from post repository";</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    }</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>}));</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">var <span class="cm-def">PostManager <span class="cm-operator">= <span class="cm-variable">Service(() <span class="cm-operator">=&gt; ({</span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-property">getId() {</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-keyword">return <span class="cm-string">"some post id";</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    }</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>}));</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">class <span class="cm-def">PostQueryBuilder {</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-property">build() {</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-keyword">return <span class="cm-string">"SUPER * QUERY";</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    }</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>}</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">var <span class="cm-def">PostController <span class="cm-operator">= <span class="cm-variable">Service([</span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-variable">PostManager,</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-variable">PostRepository,</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-variable">PostQueryBuilder</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>], (<span class="cm-def">manager, <span class="cm-def">repository, <span class="cm-def">queryBuilder) <span class="cm-operator">=&gt; {</span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-keyword">return {</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-property">id: <span class="cm-variable-2">manager.<span class="cm-property">getId(),</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-property">name: <span class="cm-variable-2">repository.<span class="cm-property">getName(),</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-property">query: <span class="cm-variable-2">queryBuilder.<span class="cm-property">build()</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    };</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>});</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">var <span class="cm-def">postController <span class="cm-operator">= <span class="cm-variable">Container.<span class="cm-property">get(<span class="cm-variable">PostController);</span></span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-variable">console.<span class="cm-property">log(<span class="cm-variable">postController);</span></span></span></span></pre>
</div>
</div>
</div>
</div>
</div>
</div>
<div>&nbsp;</div>
<div class="CodeMirror-gutters">&nbsp;</div>
</div>
</div>
</div>
<ul>
<li>基于名称的注入</li>
</ul>
<div id="wiz_cm_1570535671820_4543" class="wiz-code-container" data-mode="JavaScript" data-theme="default">
<div class="CodeMirror cm-s-default" data-id="wiz_cm_1570535671820_4543">
<div class="CodeMirror-scroll">
<div class="CodeMirror-sizer">
<div class="CodeMirror-lines">
<div class="CodeMirror-code">
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">var <span class="cm-def">Container <span class="cm-operator">= <span class="cm-variable">require(<span class="cm-string">"typedi").<span class="cm-property">Container;</span></span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">class <span class="cm-def">BeanFactory {</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-property">constructor(<span class="cm-def">container){}</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-property">create() {</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-variable">console.<span class="cm-property">log(<span class="cm-string">"BeanFactory")</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    }</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>}</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">class <span class="cm-def">SugarFactor {</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-property">constructor(<span class="cm-def">container){}</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-property">create() {</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-variable">console.<span class="cm-property">log(<span class="cm-string">"SugarFactory")</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    }</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>}</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">class <span class="cm-def">WaterFactory{</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-property">constructor(<span class="cm-def">container){}</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-property">create() {</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-variable">console.<span class="cm-property">log(<span class="cm-string">"WaterFactory")</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    }</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>}</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">class <span class="cm-def">CoffeeMaker {</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-property">constructor(<span class="cm-def">container) {</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-keyword">this.<span class="cm-property">beanFactory <span class="cm-operator">= <span class="cm-variable-2">container.<span class="cm-property">get(<span class="cm-string">"bean.factory");</span></span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-keyword">this.<span class="cm-property">sugarFactory <span class="cm-operator">= <span class="cm-variable-2">container.<span class="cm-property">get(<span class="cm-string">"sugar.factory");</span></span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-keyword">this.<span class="cm-property">waterFactory <span class="cm-operator">= <span class="cm-variable-2">container.<span class="cm-property">get(<span class="cm-string">"water.factory");</span></span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    }</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-property">make() {</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-keyword">this.<span class="cm-property">beanFactory.<span class="cm-property">create();</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-keyword">this.<span class="cm-property">sugarFactory.<span class="cm-property">create();</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-keyword">this.<span class="cm-property">waterFactory.<span class="cm-property">create();</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    }</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>}</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-variable">Container.<span class="cm-property">set(<span class="cm-string">"bean.factory", <span class="cm-keyword">new <span class="cm-variable">BeanFactory(<span class="cm-variable">Container));</span></span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-variable">Container.<span class="cm-property">set(<span class="cm-string">"sugar.factory", <span class="cm-keyword">new <span class="cm-variable">SugarFactory(<span class="cm-variable">Container));</span></span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-variable">Container.<span class="cm-property">set(<span class="cm-string">"water.factory", <span class="cm-keyword">new <span class="cm-variable">WaterFactory(<span class="cm-variable">Container));</span></span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-variable">Container.<span class="cm-property">set(<span class="cm-string">"coffee.maker", <span class="cm-keyword">new <span class="cm-variable">CoffeeMaker(<span class="cm-variable">Container));</span></span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">var <span class="cm-def">coffeeMaker <span class="cm-operator">= <span class="cm-variable">Container.<span class="cm-property">get(<span class="cm-string">"coffee.maker");</span></span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-variable">coffeeMaker.<span class="cm-property">make();</span></span></span></pre>
</div>
</div>
</div>
</div>
<div>&nbsp;</div>
<div class="CodeMirror-gutters">&nbsp;</div>
</div>
</div>
</div>
<h2 id="typescript使用">typescript 使用</h2>
<p>对于typescript 的使用我们可以利用ts提供的强大类型能力,以及注解可以编写强大的功能</p>
<ul>
<li>简单service注解 <br>
项目结构</li>
</ul>
<div id="wiz_cm_1570535671806_6523" class="wiz-code-container" data-mode="JavaScript" data-theme="default">
<div class="CodeMirror cm-s-default" data-id="wiz_cm_1570535671806_6523">
<div class="CodeMirror-scroll">
<div class="CodeMirror-sizer">
<div>
<div class="CodeMirror-lines">
<div>
<div class="CodeMirror-cursors">&nbsp;</div>
<div class="CodeMirror-code">
<div>
<pre class=" CodeMirror-line "><span><span class="cm-variable">ts</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-variable">└── <span class="cm-variable">service</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-variable">├── <span class="cm-variable">SomeClass.<span class="cm-property">ts</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-variable">└── <span class="cm-variable">demo.<span class="cm-property">ts</span></span></span></span></pre>
</div>
</div>
</div>
</div>
</div>
</div>
<div>&nbsp;</div>
<div class="CodeMirror-gutters">&nbsp;</div>
</div>
</div>
</div>
<p>demo.ts</p>
<div id="wiz_cm_1570535671794_5087" class="wiz-code-container" data-mode="JavaScript" data-theme="default"><br>
<div class="CodeMirror cm-s-default" data-id="wiz_cm_1570535671794_5087">
<div class="CodeMirror-scroll">
<div class="CodeMirror-sizer">
<div>
<div class="CodeMirror-lines">
<div>
<div class="CodeMirror-code">
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">import {<span class="cm-def">Container} <span class="cm-keyword">from <span class="cm-string">"typedi";</span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">import {<span class="cm-def">SomeClass } <span class="cm-keyword">from <span class="cm-string">"./SomeClass"</span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">let <span class="cm-def">someClass <span class="cm-operator">= <span class="cm-variable">Container.<span class="cm-property">get(<span class="cm-variable">SomeClass);</span></span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-variable">someClass.<span class="cm-property">someMethod();</span></span></span></pre>
</div>
</div>
</div>
</div>
</div>
</div>
<div>&nbsp;</div>
<div class="CodeMirror-gutters">&nbsp;</div>
</div>
</div>
</div>
<p>SomeClass.ts</p>
<div id="wiz_cm_1570535671775_2017" class="wiz-code-container" data-mode="JavaScript" data-theme="default"><br>
<div class="CodeMirror cm-s-default" data-id="wiz_cm_1570535671775_2017">
<div class="CodeMirror-scroll">
<div class="CodeMirror-sizer">
<div>
<div class="CodeMirror-lines">
<div>
<div class="CodeMirror-code">
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">import <span class="cm-string">"reflect-metadata";</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">import {<span class="cm-def">Service} <span class="cm-keyword">from <span class="cm-string">"typedi";</span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-operator">@<span class="cm-variable">Service()</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">class <span class="cm-def">SomeClass {</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-property">someMethod() {</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-variable">console.<span class="cm-property">log(<span class="cm-string">"call from service")</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    }</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>}</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">export <span class="cm-keyword">default <span class="cm-variable">SomeClass</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">export {</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-variable">SomeClass</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>}</span></pre>
</div>
</div>
</div>
</div>
</div>
</div>
<div>&nbsp;</div>
<div class="CodeMirror-gutters">&nbsp;</div>
</div>
</div>
</div>
<ul>
<li>基于属性的注入</li>
</ul>
<div id="wiz_cm_1570535671747_6025" class="wiz-code-container" data-mode="JavaScript" data-theme="default">
<div class="CodeMirror cm-s-default" data-id="wiz_cm_1570535671747_6025">
<div class="CodeMirror-scroll">
<div class="CodeMirror-sizer">
<div>
<div class="CodeMirror-lines">
<div>
<div class="CodeMirror-code">
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">import <span class="cm-string">"reflect-metadata"</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">import {<span class="cm-def">Container, <span class="cm-def">Inject, <span class="cm-def">Service} <span class="cm-keyword">from <span class="cm-string">"typedi";</span></span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-operator">@<span class="cm-variable">Service()</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">class <span class="cm-def">BeanFactory {</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-property">create() {</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-variable">console.<span class="cm-property">log(<span class="cm-string">"BeanFactory")</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    }</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>}</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-operator">@<span class="cm-variable">Service()</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">class <span class="cm-def">SugarFactory {</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-property">create() {</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-variable">console.<span class="cm-property">log(<span class="cm-string">"SugarFactory")</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    }</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>}</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-operator">@<span class="cm-variable">Service()</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">class <span class="cm-def">WaterFactory {</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-property">create() {</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-variable">console.<span class="cm-property">log(<span class="cm-string">"WaterFactory")</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    }</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>}</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-operator">@<span class="cm-variable">Service()</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">class <span class="cm-def">CoffeeMaker {</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-operator">@<span class="cm-variable">Inject()</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-property">beanFactory: <span class="cm-variable">BeanFactory;</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-operator">@<span class="cm-variable">Inject()</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-variable">sugarFactory: <span class="cm-variable">SugarFactory;</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-operator">@<span class="cm-variable">Inject()</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-variable">waterFactory: <span class="cm-variable">WaterFactory;</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-variable">make() {</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-keyword">this.<span class="cm-property">beanFactory.<span class="cm-property">create();</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-keyword">this.<span class="cm-property">sugarFactory.<span class="cm-property">create();</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-keyword">this.<span class="cm-property">waterFactory.<span class="cm-property">create();</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    }</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>}</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">let <span class="cm-def">coffeeMaker <span class="cm-operator">= <span class="cm-variable">Container.<span class="cm-property">get(<span class="cm-variable">CoffeeMaker);</span></span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-variable">coffeeMaker.<span class="cm-property">make();</span></span></span></pre>
</div>
</div>
</div>
</div>
</div>
</div>
<div>&nbsp;</div>
<div class="CodeMirror-gutters">&nbsp;</div>
</div>
</div>
</div>
<ul>
<li>基于服务名的注入</li>
</ul>
<div id="wiz_cm_1570535671716_6573" class="wiz-code-container" data-mode="JavaScript" data-theme="default">
<div class="CodeMirror cm-s-default" data-id="wiz_cm_1570535671716_6573">
<div class="CodeMirror-scroll">
<div class="CodeMirror-sizer">
<div>
<div class="CodeMirror-lines">
<div>
<div class="CodeMirror-code">
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">import <span class="cm-string">"reflect-metadata"</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">import {<span class="cm-def">Container, <span class="cm-def">Service, <span class="cm-def">Inject} <span class="cm-keyword">from <span class="cm-string">"typedi";</span></span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-variable">interface <span class="cm-variable">Factory {</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-variable">create(): <span class="cm-keyword">void;</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>}</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-operator">@<span class="cm-variable">Service(<span class="cm-string">"bean.factory")</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">class <span class="cm-def">BeanFactory <span class="cm-keyword">implements <span class="cm-variable">Factory {</span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-property">create() {</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-variable">console.<span class="cm-property">log(<span class="cm-string">"BeanFactory")</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    }</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>}</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-operator">@<span class="cm-variable">Service(<span class="cm-string">"sugar.factory")</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">class <span class="cm-def">SugarFactory <span class="cm-keyword">implements <span class="cm-variable">Factory {</span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-property">create() {</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-variable">console.<span class="cm-property">log(<span class="cm-string">"SugarFactory")</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    }</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>}</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-operator">@<span class="cm-variable">Service(<span class="cm-string">"water.factory")</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">class <span class="cm-def">WaterFactory <span class="cm-keyword">implements <span class="cm-variable">Factory {</span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-property">create() {</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-variable">console.<span class="cm-property">log(<span class="cm-string">"WaterFactory")</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    }</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>}</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-operator">@<span class="cm-variable">Service(<span class="cm-string">"coffee.maker")</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">class <span class="cm-def">CoffeeMaker {</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-property">beanFactory: <span class="cm-variable">Factory;</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-variable">sugarFactory: <span class="cm-variable">Factory;</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-operator">@<span class="cm-variable">Inject(<span class="cm-string">"water.factory")</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-variable">waterFactory: <span class="cm-variable">Factory;</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-variable">constructor(<span class="cm-operator">@<span class="cm-variable">Inject(<span class="cm-string">"bean.factory") <span class="cm-variable">beanFactory: <span class="cm-variable">BeanFactory,</span></span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>                <span class="cm-operator">@<span class="cm-variable">Inject(<span class="cm-string">"sugar.factory") <span class="cm-variable">sugarFactory: <span class="cm-variable">SugarFactory) {</span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-keyword">this.<span class="cm-property">beanFactory <span class="cm-operator">= <span class="cm-variable">beanFactory;</span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-keyword">this.<span class="cm-property">sugarFactory <span class="cm-operator">= <span class="cm-variable">sugarFactory;</span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    }</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-variable">make() {</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-keyword">this.<span class="cm-property">beanFactory.<span class="cm-property">create();</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-keyword">this.<span class="cm-property">sugarFactory.<span class="cm-property">create();</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-keyword">this.<span class="cm-property">waterFactory.<span class="cm-property">create();</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    }</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>}</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">let <span class="cm-def">coffeeMaker <span class="cm-operator">= <span class="cm-variable">Container.<span class="cm-property">get<span class="cm-operator">&lt;<span class="cm-variable">CoffeeMaker<span class="cm-operator">&gt;(<span class="cm-string">"coffee.maker");</span></span></span></span></span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-variable">coffeeMaker.<span class="cm-property">make();</span></span></span></pre>
</div>
</div>
</div>
</div>
</div>
</div>
<div>&nbsp;</div>
<div class="CodeMirror-gutters">&nbsp;</div>
</div>
</div>
</div>
<ul>
<li>循环依赖的处理 <br>
对于循环依赖我们需要指定类型,如下:</li>
</ul>
<div id="wiz_cm_1570535671698_1137" class="wiz-code-container" data-mode="JavaScript" data-theme="default">
<div class="CodeMirror cm-s-default" data-id="wiz_cm_1570535671698_1137">
<div class="CodeMirror-scroll">
<div class="CodeMirror-sizer">
<div>
<div class="CodeMirror-lines">
<div>
<div class="CodeMirror-cursors">&nbsp;</div>
<div class="CodeMirror-code">
<div>
<pre class=" CodeMirror-line "><span><span class="cm-comment">// Car.ts</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-operator">@<span class="cm-variable">Service()</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">export <span class="cm-keyword">class <span class="cm-def">Car {</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-operator">@<span class="cm-variable">Inject()</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-property">engine: <span class="cm-variable">Engine;</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>}</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-comment">// Engine.ts</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-operator">@<span class="cm-variable">Service()</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">export <span class="cm-keyword">class <span class="cm-def">Engine {</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-operator">@<span class="cm-variable">Inject()</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-property">car: <span class="cm-variable">Car;</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>}</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-variable">应该为:</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-comment">// Car.ts</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-operator">@<span class="cm-variable">Service()</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">export <span class="cm-keyword">class <span class="cm-def">Car {</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-operator">@<span class="cm-variable">Inject(<span class="cm-def">type <span class="cm-operator">=&gt; <span class="cm-variable">Engine)</span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-property">engine: <span class="cm-variable">Engine;</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>}</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-comment">// Engine.ts</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-operator">@<span class="cm-variable">Service()</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">export <span class="cm-keyword">class <span class="cm-def">Engine {</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-operator">@<span class="cm-variable">Inject(<span class="cm-def">type <span class="cm-operator">=&gt; <span class="cm-variable">Car)</span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-property">car: <span class="cm-variable">Car;</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>}</span></pre>
</div>
</div>
</div>
</div>
</div>
</div>
<div>&nbsp;</div>
<div class="CodeMirror-gutters">&nbsp;</div>
</div>
</div>
</div>
<ul>
<li>注入继承</li>
</ul>
<div id="wiz_cm_1570535671685_5070" class="wiz-code-container" data-mode="JavaScript" data-theme="default">
<div class="CodeMirror cm-s-default" data-id="wiz_cm_1570535671685_5070">
<div class="CodeMirror-scroll">
<div class="CodeMirror-sizer">
<div>
<div class="CodeMirror-lines">
<div>
<div class="CodeMirror-code">
<div>
<pre class=" CodeMirror-line "><span><span class="cm-comment">// Car.ts</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-operator">@<span class="cm-variable">Service()</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">export <span class="cm-variable">abstract <span class="cm-keyword">class <span class="cm-def">Car {</span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-operator">@<span class="cm-variable">Inject()</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-property">engine: <span class="cm-variable">Engine;</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>}</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-comment">// Engine.ts</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-operator">@<span class="cm-variable">Service()</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">export <span class="cm-keyword">class <span class="cm-def">Bus <span class="cm-keyword">extends <span class="cm-variable">Car {</span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-comment">// you can call this.engine in this class</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>}</span></pre>
</div>
</div>
</div>
</div>
</div>
</div>
<div>&nbsp;</div>
<div class="CodeMirror-gutters">&nbsp;</div>
</div>
</div>
</div>
<ul>
<li>服务组 <br>
方便组合依赖的服务</li>
</ul>
<div id="wiz_cm_1570535671640_3527" class="wiz-code-container" data-mode="JavaScript" data-theme="default">
<div class="CodeMirror cm-s-default" data-id="wiz_cm_1570535671640_3527">
<div class="CodeMirror-scroll">
<div class="CodeMirror-sizer">
<div>
<div class="CodeMirror-lines">
<div>
<div class="CodeMirror-cursors">&nbsp;</div>
<div class="CodeMirror-code">
<div>
<pre class=" CodeMirror-line "><span><span class="cm-comment">// Factory.ts</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">import <span class="cm-string">"reflect-metadata"</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">import {<span class="cm-def">Container, <span class="cm-def">Service,<span class="cm-def">Token} <span class="cm-keyword">from <span class="cm-string">"typedi";</span></span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">export <span class="cm-variable">interface <span class="cm-variable">Factory {</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-variable">create(): <span class="cm-variable">any;</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>}</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-comment">// FactoryToken.ts</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">export <span class="cm-keyword">const <span class="cm-def">FactoryToken <span class="cm-operator">= <span class="cm-keyword">new <span class="cm-variable">Token<span class="cm-operator">&lt;<span class="cm-variable">Factory<span class="cm-operator">&gt;(<span class="cm-string">"factories");</span></span></span></span></span></span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-comment">// BeanFactory.ts</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-operator">@<span class="cm-variable">Service({ <span class="cm-property">id: <span class="cm-variable">FactoryToken, <span class="cm-property">multiple: <span class="cm-atom">true })</span></span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">export <span class="cm-keyword">class <span class="cm-def">BeanFactory <span class="cm-keyword">implements <span class="cm-variable">Factory {</span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-property">create() {</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-variable">console.<span class="cm-property">log(<span class="cm-string">"bean created");</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    }</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>}</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-comment">// SugarFactory.ts</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-operator">@<span class="cm-variable">Service({ <span class="cm-property">id: <span class="cm-variable">FactoryToken, <span class="cm-property">multiple: <span class="cm-atom">true })</span></span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">export <span class="cm-keyword">class <span class="cm-def">SugarFactory <span class="cm-keyword">implements <span class="cm-variable">Factory {</span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-property">create() {</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-variable">console.<span class="cm-property">log(<span class="cm-string">"sugar created");</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    }</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>}</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-comment">// WaterFactory.ts</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-operator">@<span class="cm-variable">Service({ <span class="cm-property">id: <span class="cm-variable">FactoryToken, <span class="cm-property">multiple: <span class="cm-atom">true })</span></span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">export <span class="cm-keyword">class <span class="cm-def">WaterFactory <span class="cm-keyword">implements <span class="cm-variable">Factory {</span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-property">create() {</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>      <span class="cm-variable">console.<span class="cm-property">log(<span class="cm-string">"water created");</span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    }</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>}</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span>​</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-comment">// app.ts</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-comment">// now you can get all factories in a single array</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-variable">Container.<span class="cm-property">import([</span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-variable">BeanFactory,</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-variable">SugarFactory,</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>    <span class="cm-variable">WaterFactory,</span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span>]);</span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-keyword">const <span class="cm-def">factories <span class="cm-operator">= <span class="cm-variable">Container.<span class="cm-property">getMany(<span class="cm-variable">FactoryToken); <span class="cm-comment">// factories is Factory[]</span></span></span></span></span></span></span></span></pre>
</div>
<div>
<pre class=" CodeMirror-line "><span><span class="cm-variable">factories.<span class="cm-property">forEach(<span class="cm-def">factory <span class="cm-operator">=&gt; <span class="cm-variable-2">factory.<span class="cm-property">create());</span></span></span></span></span></span></span></pre>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="CodeMirror-gutters">&nbsp;</div>
</div>
</div>
</div>
<h2 id="说明">说明</h2>
<p>typedi 功能还是很强大,是web开发中的一个利器</p>
<h2 id="参考资料">参考资料</h2>
<p>https://github.com/typestack/typedi <br>
https://github.com/rongfengliang/typedi-learning</p><br><br>
来源:https://www.cnblogs.com/rongfengliang/p/11637595.html
頁: [1]
查看完整版本: typedi 强大的javascript以及typescript 依赖注入框架