Angular:动态依赖注入和静态依赖注入

这篇具有很好参考价值的文章主要介绍了Angular:动态依赖注入和静态依赖注入。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

问题描述:

自己写的服务依赖注入到组件时候是直接在构造器内初始化的。

直到看见代码中某大哥写的 private injector: Injector 

Angular:动态依赖注入和静态依赖注入,ABP,angular,angular.js,javascript

动态依赖注入和静态依赖注入

在 Angular 中,使用构造函数注入的方式将服务注入到组件中是一种静态依赖注入的方式。这种方式需要在组件的构造函数中显式声明该服务的类型,并由 Angular 的依赖注入系统自动创建和注入该服务的实例。

例如,在以下代码中:

import { Component } from '@angular/core';
import { MyService } from './my.service';

@Component({
  selector: 'app-root',
  template: '<h1>{{ message }}</h1>',
  providers: [MyService]
})
export class AppComponent {
  message: string;

  constructor(private myService: MyService) {
    this.message = this.myService.getMessage();
  }
}

我们在 `providers` 数组中声明了 `MyService`,并在 `AppComponent` 组件的构造函数中将 `MyService` 注入到了 `myService` 参数中。这样做的好处是可以在编译时检查依赖关系,并确保依赖项已经被正确地注册和注入。缺点是需要显式声明依赖关系,如果依赖项发生变化,那么需要手动更新代码。

与之相比,在运行时动态获取服务实例的方式,可以更加灵活地管理依赖关系。例如,在以下代码中:

import { Component, Injector } from '@angular/core';
import { MyService } from './my.service';

@Component({
  selector: 'app-root',
  template: '<h1>{{ message }}</h1>'
})
export class AppComponent {
  message: string;

  constructor(private injector: Injector) {
    const myService = this.injector.get(MyService);
    this.message = myService.getMessage();
  }
}

我们使用 `Injector` 获取了一个名为 `MyService` 的服务实例,并调用了该服务的 `getMessage` 方法来获取消息,然后将消息显示在模板中。这样做的好处是可以在运行时动态获取服务实例,并避免了显式声明依赖关系的问题。缺点是需要手动管理依赖关系,并且容易出现运行时错误。

“缺点是需要手动管理依赖关系”,这句话我不理解,静态依赖注入的方式不也是需要在构造器内声明所有的服务吗?

在静态依赖注入的方式中,我们需要在组件的构造函数中显式声明该服务的类型,并由 Angular 的依赖注入系统自动创建和注入该服务的实例。这种方式需要我们手动管理组件所依赖的服务,并且在服务发生变化时需要手动更新构造函数中的依赖关系。

相比之下,在运行时动态获取服务实例的方式,我们可以更加灵活地管理依赖关系。例如,我们可以根据不同的条件获取不同的服务实例,或者在运行时动态添加或删除服务实例等。这种方式可以让我们更加灵活地管理应用程序中的依赖关系,并且可以避免在组件中显式声明依赖关系所带来的一些限制。

我想知道,Angular的Injector是如何做到运行时动态获取服务实例?

当 Angular 解析依赖关系时,它会检查每个依赖项的类型,并尝试创建该类型的实例。如果该类型是一个可注入的服务,则会检查该服务的构造函数参数,并递归地解析这些参数的依赖关系。这个过程会一直持续下去,直到所有依赖项都被创建为止。

在创建依赖项时,Angular 会根据以下几个因素来判断是否需要创建该依赖项的实例:

1. 依赖项是否已经被创建:如果该依赖项已经被创建过了,那么 Angular 就不需要再次创建它了。相反,它会直接返回之前创建的实例。

2. 依赖项是否是可选的:如果该依赖项是可选的,并且没有被注册到任何模块或组件中,那么 Angular 会将其设置为 `null`。否则,它会抛出一个错误。

3. 依赖项是否可以被循环依赖:如果该依赖项和其它依赖项之间存在循环依赖关系,那么 Angular 会抛出一个错误。

4. 依赖项是否可以被解析:如果该依赖项的类型无法被解析(例如,由于缺少必要的元数据),那么 Angular 会抛出一个错误。

综上所述,Angular 会根据依赖项的类型、是否已经被创建以及其它一些因素来判断是否需要创建该依赖项的实例。如果该依赖项是必要的,并且满足所有创建条件,则 Angular 会创建该依赖项的实例并返回给组件或指令。

“以便在后续的请求中重复使用” 后续的请求指的是什么?

在 Angular 应用程序中,每次创建服务实例时,Angular 都会将其缓存起来以便在后续的请求中重复使用。这里的“请求”指的是对该服务实例的请求,例如在组件、指令或其他服务中调用该服务的方法或属性。

例如,假设我们有一个名为 `MyService` 的服务,它提供了一个名为 `getMessage` 的方法来获取一条消息。当我们在组件中使用 `MyService` 时,Angular 会自动创建 `MyService` 的一个实例,并将其缓存起来。如果我们在同一个组件中多次调用 `getMessage` 方法,那么 Angular 就会重复使用之前创建的 `MyService` 实例,而不是每次都创建一个新的实例。

这种缓存机制可以提高性能,并确保所有组件和指令都使用同一个服务实例。同时,由于服务实例是单例的,因此它们可以在整个应用程序中共享数据和状态。文章来源地址https://www.toymoban.com/news/detail-615192.html

到了这里,关于Angular:动态依赖注入和静态依赖注入的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 2023年最佳JavaScript框架:React、Vue、Angular和Node.js的比较

    🎉欢迎来到Java学习路线专栏~探索2023年最佳JavaScript框架:React、Vue、Angular和Node.js的比较 ☆* o(≧▽≦)o *☆嗨~我是IT·陈寒🍹 ✨博客主页:IT·陈寒的博客 🎈该系列文章专栏:Java学习路线 📜其他专栏:Java学习路线 Java面试技巧 Java实战项目 AIGC人工智能 🍹文章作者技术和水

    2024年02月11日
    浏览(49)
  • ABP - 依赖注入(2)

    这是将服务注入类的最常用方法,是将依赖项注入类的首选方式,也是微软推崇的模式。这样,除非提供了所有构造方法注入的依赖项,否则无法构造类,显示的声明了类必需的服务,使开发人员一目了然。 Microsoft依赖注入库不支持属性注入, 属性注入是Abp框架使用autofac容器

    2024年02月06日
    浏览(38)
  • ABP - 依赖注入(1)

    依赖注入实现了系统之间、模块之间和对象之间依赖关系的解耦,基本上是现代应用程序框架必不可少的一个组成部分。 ABP的依赖注入系统是基于Microsoft的依赖注入扩展库(Microsoft.Extensions.DependencyInjection),所以能够完全兼容.net Core中的依赖注入的用法,同时使用 Autofac 替

    2024年02月05日
    浏览(38)
  • Abp vNext 依赖注入

    文章目录 ABP的依赖注入系统是基于Microsoft的依赖注入扩展库(Microsoft.Extensions.DependencyInjection nuget包)开发的。所以我们采用 dotnet自带的注入方式也是支持的 。 由于ABP是一个模块化框架,因此每个模块都定义它自己的服务并在它自己的单独模块类中通过依赖注入进行注册.例

    2024年02月08日
    浏览(42)
  • angular注入方法providers

    在Angular中有很多方式可以将服务类注册到注入器中: @Injectable 元数据中的providedIn属性 @NgModule 元数据中的 providers属性 @Component 元数据中的 providers属性 创建一个文件名叫名 hero.service.ts叫 hero 的服务  hero.service.ts 1.@Injectable 元数据中的providedIn属性 providedIn: \\\'root\\\' 告诉 Angular在根

    2024年02月12日
    浏览(39)
  • 第一个 Angular 项目 - 动态页面

    使用的所有技巧都在下面的笔记里: [Angular 基础] - 数据绑定(databinding) [Angular 基础] - 指令(directives) 以上为静态页面,即不涉及到跨组件交流的内容 以下涉及到组件内的沟通,从这开始数据就“活”了 [Angular 基础] - 自定义事件 自定义属性 [Angular 基础] - 视图封装 局部引用

    2024年02月20日
    浏览(27)
  • Abp Vnext 动态(静态)API客户端源码解析

    根据以往的经验,通过接口远程调用服务的原理大致如下: 服务端:根据接口定义方法的签名生成路由,并暴露Api。 客户端:根据接口定义方法的签名生成请求,通过HTTPClient调用。 这种经验可以用来理解ABP VNext自动API的方式,但如果不使用自动API并且控制器定义了路由的情

    2024年02月06日
    浏览(56)
  • 二甲医院信息管理系统源码 his系统源码 java+Angular+JavaScript

    云HIS系统采用SaaS软件应用服务模式,提供软件应用服务多租户机制,实现一中心部署多机构使用。主要包含收费计费、药品管理、门诊医生工作站、住院医生工作站、护士工作站、数据统计、电子病历、医保接口等功能,能够满足医院及诊所日常业务开展的需要。     设计

    2024年02月11日
    浏览(45)
  • 关于 Angular 和 Node.js 版本的问题

    只有 Angular 12 才支持 Node.js 16 吗?Angular 10 呢? StackOverflow 有朋友抱怨关于 Angular 和 Node.js 版本的问题: 我的实际工作中,经常不得不启动旧的 Angular 项目,其中包含已弃用的 Angular 依赖项。 因为我经常运行最新的 Node.js 版本(至少是最新的 LTS 版本),所以我经常遇到无法

    2024年02月04日
    浏览(48)
  • angular——子组件如何接收父组件的动态传值

    开发过程中,父组件给子组件传值的情况很常见,今天我们就来聊聊父组件给子组件传值可能会发生哪些意外,什么情况下子组件无法接收到父组件最新的传值; 基本数据类型 :父组件给子组件传递 基本数据类型 ,子组件使用变量接收传值;当传值发生变化,子组件接收的

    2024年02月14日
    浏览(42)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包