ホームページ > ウェブフロントエンド > jsチュートリアル > AngularJS 依存関係注入の原理の詳細な分析

AngularJS 依存関係注入の原理の詳細な分析

零到壹度
リリース: 2018-03-28 15:06:35
オリジナル
3232 人が閲覧しました

この記事では主に AngularJS の依存関係注入原理の詳細な分析を共有します。これは優れた参考値であり、皆様のお役に立てれば幸いです。編集者をフォローして見てみましょう。

依存性注入: 依存性注入略語DI

例:

var xiaomi = new Xiaomi();     // 假设小米公司生产了一台xiaomi手机
createShipment(xiaomi);         //此方法能把货送给顾客,这叫做把小米手机注入到createShipment()方法
ログイン後にコピー

createpayment() メソッドには (携帯電話、速達会社、注文詳細)、次のものが必要です:

var xiaomi = new Xiaomi();     // 不仅要生产手机
var shipCompany = new ShipCompany();   // 还要自己建立个快递公司
var order = new Order();      // 还要自己建立线上线下平台做订单
createShipmentxiaomi,shipCompany,order);   // 虽然小米已经这么干了,但还是很累的
ログイン後にコピー

上記の例では、Xiaomiには自社ストアでの販売以外に他のチャネルはありませんか?携帯電話を作るだけでなく、仕事や急ぎの配達もやらなければならないので、疲れていませんか? Xiaomi は独自に行うだけでなく、Taobao、JD.com、Suning などのプラットフォームで販売したり、Santong Yishun などの運送会社を利用して商品を配送したりすることもできます。これが依存関係注入で解決する必要がある問題です。 Taobao、JD.com、SF Expressなどの企業を利用するということは、販売サービス(sellService)、速達サービス(sendService)などをXiaomiに注入することです!

制御の反転: 制御の反転略語IOC

IOCは、依存関係の制御をコードの内部からコードの内部に移すことを指します。たとえば、Xiaomi は携帯電話を外部に販売および配送する権限を与えています。Taobao が販売するか、JD が販売するか、YTO が配送するか、SF Express が配送するかについては、Xiaomi が気にする必要はありません。携帯電話。専門的なことは専門家にお任せください。

IOCは疎結合モードであり、実装手段は依存性注入です。

インジェクター:

コンストラクター(privatesomeService : SomeService) {...}

この文は、このコンポーネントが someService の属性を宣言し、そのタイプが SomeService であることを示し、その後 angular がプロバイダーにアクセスして SomeService のインスタンスを検索することを意味します。そして、このインスタンスを someService に注入します。

提供器:

providers:[{provide:SomeService,useClass:SomeService}]

providers:[SomeService]//provideuseClass相同可简写为这个

例:

app.module.ts

@NgModule({  
    providers:[{provide:SellService,useClass:ShunfengService}],             // 这个是淘宝,用的顺丰
      // providers: [{provide:SellService,useClass:YuantongService}]          // 这个是京东,用的圆通})
product.component.ts
@Component({  ...
})
     export class ProductComponent implements OnInit {  product: Product;  constructor(sellService: SellService) {
        this.product = this.sellService.sendProduct();
  }}
ログイン後にコピー

上面的代码怎么理解呢?

小米声明sellService对象(也是属性),叫sellService去卖手机,sellService呼叫售卖服务,这个服务是SellService类型的(线上销售),那么angular就会去提供器里面找谁在提供这个售卖服务,至于是淘宝还是京东那要看提供器里面的,用的哪个快递公司就更加不需要小米公司来管了。angular找到SellService之后会new一个ShunfengService的一个实例(找一家顺丰门店),找到之后把服务注入给小米公司的sellServicesellService就跑到那家顺丰门店填送货单(sendProduct方法)把手机送给客户了。

各位看官应该能想出更好的比喻,欢迎交流。如果有不妥之处欢迎指正。

相关推荐:

AngularJS 依赖注入解析

AngularJS中的依赖注入

30行代码让你理解angular依赖注入:angular 依赖注入原理

以上がAngularJS 依存関係注入の原理の詳細な分析の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート