首页 > 其他分享 >Angular - 生命周期钩子

Angular - 生命周期钩子

时间:2023-11-29 14:22:23浏览次数:36  
标签:生命周期 钩子 视图 调用 指令 组件 Angular 属性

Angular 会按以下顺序执行钩子方法。可以用它来执行以下类型的操作。

钩子方法用途时机
ngOnChanges() 当 Angular 设置或重新设置数据绑定的输入属性时响应。 该方法接受当前和上一属性值的 SimpleChanges 对象注意,这发生的非常频繁,所以你在这里执行的任何操作都会显著影响性能。 如果组件绑定过输入属性,那么在 ngOnInit() 之前以及所绑定的一个或多个输入属性的值发生变化时都会调用。注意,如果你的组件没有输入属性,或者你使用它时没有提供任何输入属性,那么框架就不会调用 ngOnChanges()
ngOnInit() 在 Angular 第一次显示数据绑定和设置指令/组件的输入属性之后,初始化指令/组件。 在第一轮 ngOnChanges() 完成之后调用,只调用一次。而且即使没有调用过 ngOnChanges(),也仍然会调用 ngOnInit()(比如当模板中没有绑定任何输入属性时)。
ngDoCheck() 检测,并在发生 Angular 无法或不愿意自己检测的变化时作出反应。 紧跟在每次执行变更检测时的 ngOnChanges() 和 首次执行变更检测时的 ngOnInit() 后调用。
ngAfterContentInit() 当 Angular 把外部内容投影进组件视图或指令所在的视图之后调用。 第一次 ngDoCheck() 之后调用,只调用一次。
ngAfterContentChecked() 每当 Angular 检查完被投影到组件或指令中的内容之后调用。 ngAfterContentInit() 和每次 ngDoCheck() 之后调用
ngAfterViewInit() 当 Angular 初始化完组件视图及其子视图或包含该指令的视图之后调用。 第一次 ngAfterContentChecked() 之后调用,只调用一次。
ngAfterViewChecked() 每当 Angular 做完组件视图和子视图或包含该指令的视图的变更检测之后调用。 ngAfterViewInit() 和每次 ngAfterContentChecked() 之后调用。
ngOnDestroy() 每当 Angular 每次销毁指令/组件之前调用并清扫。 在这儿反订阅可观察对象和分离事件处理器,以防内存泄漏。 在 Angular 销毁指令或组件之前立即调用。

参考官方文档:Angular - 生命周期钩子

标签:生命周期,钩子,视图,调用,指令,组件,Angular,属性
From: https://www.cnblogs.com/fubuki/p/17864740.html

相关文章

  • Spring Bean 的生命周期,如何被管理的?
    实例化一个Bean,也就是我们通常说的new按照Spring上下文对实例化的Bean进行配置,也就是IOC注入如果这个Bean实现了BeanNameAware接口,会调用它实现的setBeanName(StringbeanId)方法,此处传递的是Spring配置文件中Bean的ID如果这个Bean实现了BeanFactoryAware接口,会调用它实现的set......
  • 软件开发生命周期模型——05
    10.极限编程(XP,ExtremeProgramming)定义:XP是一种轻量(敏捷)、高效、低风险、柔性、可预测、科学而且充满乐趣的软件开发方式。由价值观、原则、实践和行为四个部分组成,它们彼此相互依赖、关联,并通过行为贯穿于整个生命周期。与其他方法论的区别:在更短的周期内,更早地提供具体、持续的......
  • 通过项目中的实际例子,介绍 LocalStorage 在 Angular 开发中的使用场景
    笔者之前在掘金社区的技术文章,介绍过自己项目组中负责开发的一款基于Angular的电商SDK:Angular应用支持PWA(ProgressiveWebApplication)特性的开发步骤分享Angular应用的搜索引擎优化(SEO)实战指南本文笔者会分享自己项目过程中,在设计这款SDK时使用Web开发领域的......
  • 【pytest】基于钩子函数与conftest实现多套环境切换
    项目路径config.pyfromutils.connect_mysqlimportDbConnectclassBaseConfig:VERSION="v1.0"EMAIL="[email protected]"APPID="10086"classTestConfig(BaseConfig):BASE_URL="http://xxxx:8201"......
  • Codebeamer—软件全生命周期管理轻量级平台
    产品概述    Codebeamer涵盖了软件研发的生命周期,在一个整合的平台内支持需求管理、测试管理、软件开发过程管理以及项目管理等,同时具有IToperations&DevOps相关的内容,并支持变体管理的功能。对于使用集成的应用程序生命周期管理(ALM)来简化、加快交付的产品开发团队和组织......
  • [机翻]Fun With Another PG-Compliant Hook/另一个符合 PG 标准的钩子的乐趣
    原文链接:https://revers.engineering/fun-with-pg-compliant-hook/目录Overview/概述CommonHookPointsinWindowsKernel/Windows内核中的常见钩子点TheHalPrivateDispatchTableTargetDiscovery/目标发现DIY…MOSTLYDIY.../主要δLocatingHalPrivateDispatchTable/......
  • Angular 依赖注入领域里 optional constructor parameters 的概念介绍
    Angular依赖注入(DI)是一个强大且灵活的设计模式,它可以帮助我们更好地管理和组织我们的代码。构造函数参数的可选性(Optional)是AngularDI系统的一个重要特性。这种特性允许我们将某些服务或值作为可选依赖注入到组件或服务中,这样,如果这些服务或值不存在,我们的代码仍然可以正常工......
  • 什么是 Angular 基于 Constructor Parameter 的 Dependency Injection
    在Angular中,依赖注入(DependencyInjection,DI)是一种设计模式,用于处理如何在不同的代码部分创建和传递依赖对象。在Angular中,我们通常依赖于TypeScript的特性,如构造函数参数(constructorparameters)来执行依赖注入。构造函数参数进行依赖注入是AngularDI系统的一个重要特......
  • Angular 使用 Constructor Parameters 进行依赖注入的优缺点
    构造函数参数(ConstructorParameters)在Angular中是一种进行依赖注入(DependencyInjection)的重要方式之一。依赖注入是一种设计模式,通过该模式,一个类的依赖关系不是在类内部直接创建,而是通过外部提供这些依赖关系。在Angular中,依赖注入通过注入器(Injector)来实现,而构造函数参数是一......
  • Java线程生命周期
    操作系统线程生命周期操作系统线程生命状态有5种。初始状态(New)进程正在被创建时的状态。仅为线程对象开辟了一块堆内存,实际上线程在操作系统层面还未创建。就绪状态(Ready)可运行,由于其他进程处于运行状态而暂时停止运行运行状态(Running)该进程此时正占用CPU......