首页 > 其他分享 >angular - 属性修饰器的使用

angular - 属性修饰器的使用

时间:2024-10-29 11:02:37浏览次数:4  
标签:tbcontainer 代码 修饰 属性 angular 赋值

参考文章

https://zhuanlan.zhihu.com/p/65764702

 

例子:

以前的代码,针对表格的滚动区高度动态设置代码,需要在每个组件里利用ResizeObserver监听表格容器尺寸变化,然后动态修改滚动区高度,这样在代码里存在大量的相似冗余

 

 

引入属性修饰器,能够抽象公共代码,如下

 

业务组件里按照下面使用,参数为nzScroll属性对应的变量名

 

 

修饰器函数在类加载时执行,接收的参数target为类的原型prototype,key为属性名tbcontainer

对prototype设置访问器属性,那么在对tbcontainer赋值时,就会触发get/set函数(知识点)

 

框架会在ngAfterViewInit钩子里对tbcontainer初始赋值,并且在后续变更检测过程中会持续变更tbcontainer属性(ngAfterViewChecked钩子拿到)。为了避免重复创建resizeObserver,需要判空处理;并且为了避免内存泄漏,需要在监测到对tbcontainer赋值为null时,执行observer.disconnect,释放监听

 

 

标签:tbcontainer,代码,修饰,属性,angular,赋值
From: https://www.cnblogs.com/querybest/p/18512496

相关文章

  • angular -响应式表单深入
    响应式表单为@angular/form包提供的ReactiveFormsModule,核心思想是围绕流observable,对表单进行数据设置、获取、校验等Angular/common包里的表单表单项有层级结构,表单项基础构造类为FormControl,当页面片段需要使用多字段聚合的表单,需要用到FormGroup或FormArray,注意FormArray不......
  • angular - modal弹窗的关闭行为深入
    背景:民康项目中,弹窗里有echarts图,需要在弹窗关闭时dispose掉echarts,在nzOnCancel的方法里进行dispose操作,正常在当前页面里打开关闭弹窗是可以触发nzOnCancel的,但是url栏里输入url跳转到其他菜单,nzOnCancel不会触发,这样就存在内存泄露的风险 前置介绍简单提一下ng组件加载的......
  • angular-变更检测流程理解
    变更检测是在js事件循环过程中,将组件的数据变化反映到视图上的一种机制具体过程如下: 几点关键的:1、子组件的ngonchangengDoCheckngAfterContentChecked是在父组件更新dom(第9步)前完成2、在所有子组件的afterViewChecked钩子执行之前,父组件的ViewChild查询表就会更新,在所......
  • Angular 19 "要" 来了⚡
    前言Angular19预计会在11月中旬发布,目前(2024-10-27)最新版本是v19.0.0-next.11。这次v19的改动可不小哦,新增了很多功能,甚至连effect都breakingchanges了呢......
  • C# 13(.Net 9) 中的新特性 - 半自动属性
    C#13即.Net9按照计划会在2024年11月发布,目前一些新特性已经定型,今天让我们来预览其中的一个新特性:作者注:该特性虽然随着C#13发布,但是仍然是处于preview状态的特性,请谨慎使用半自动属性Semi-autoproperties大家都知道,C#早在3.0时候就添加了自动属性这个特性,让我......
  • 界面控件DevExpress WPF v24.1新版亮点:属性网格、轻量级主题升级
    DevExpressWPF拥有120+个控件和库,将帮助您交付满足甚至超出企业需求的高性能业务应用程序。通过DevExpressWPF能创建有着强大互动功能的XAML基础应用程序,这些应用程序专注于当代客户的需求和构建未来新一代支持触摸的解决方案。DevExpressWPF控件今年一个重大版本——v24.1全......
  • List<Map<String,Object>> 属性获取
    publicstaticvoidmain(String[]args){//1.数据准备List<Map<String,Object>>list=newArrayList<>();Map<String,Object>map=newHashMap<>();map.put("name","songwp");......
  • 学习笔记(六):ArkUi-线性布局 (Row/Column)常用属性
    一、space属性设置排列方向上子元素的间距,使各子元素在排列方向上有等间距效果。 二、alignItems属性设置子元素在交叉轴(排列方向的垂直方向)上的对齐方式。且在各类尺寸屏幕中,表现一致。其中,交叉轴为垂直方向时,取值为VerticalAlign类型,水平方向取值为HorizontalAlign类型。......
  • Java 权限修饰符详解
    Java权限修饰符详解在Java中,**权限修饰符(AccessModifiers)**用于控制类、方法、变量和构造函数的可见性。理解和使用这些修饰符可以帮助我们更好地封装和组织代码,提高程序的安全性和可维护性。1.权限修饰符的类型Java中主要有四种权限修饰符,分别是:public、protecte......
  • autofac属性注入
    usingAutofac;namespaceautofac属性注入;internalclassProgram{staticvoidMain(string[]args){//创建一个容器ContainerBuilderbuilder=newContainerBuilder();//注册UserServicebuilder.RegisterType<UserService......