没有找到合适的产品?
联系客服协助选型:023-68661681
提供3000多款全球软件/控件产品
针对软件研发的各个阶段提供专业培训与技术咨询
根据客户需求提供定制化的软件开发服务
全球知名设计软件,显著提升设计质量
打造以经营为中心,实现生产过程透明化管理
帮助企业合理产能分配,提高资源利用率
快速打造数字化生产线,实现全流程追溯
生产过程精准追溯,满足企业合规要求
以六西格玛为理论基础,实现产品质量全数字化管理
通过大屏电子看板,实现车间透明化管理
对设备进行全生命周期管理,提高设备综合利用率
实现设备数据的实时采集与监控
利用数字化技术提升油气勘探的效率和成功率
钻井计划优化、实时监控和风险评估
提供业务洞察与决策支持实现数据驱动决策
原创|行业资讯|编辑:龚雪|2025-08-15 11:07:35.293|阅读 12 次
概述:本文将为大家介绍DevExtreme Angular UI 控件在新版本中引入的全新严格类型配置组件,旨在提升代码可读性、类型安全性和开发效率,并规划了旧组件的逐步替换计划。
# 界面/图表报表/文档/IDE等千款热门软控件火热销售中 >>
DevExtreme拥有高性能的HTML5 / JavaScript小部件集合,使您可以利用现代Web开发堆栈(包括React,Angular,ASP.NET Core,jQuery,Knockout等)构建交互式的Web应用程序。从Angular和Reac,到ASP.NET Core或Vue,DevExtreme包含高性能和响应式UI小部件集合,可在传统Web和下一代移动应用程序中使用。 该套件附带功能齐全的数据网格、交互式图表小部件、数据编辑器等。
DevExpress技术交流群11:749942875 欢迎一起进群讨论
如果您之前使用过 DevExtreme 的 Angular 组件,可能会接触过带有 dxo- 和 dxi- 前缀的配置组件。这些辅助组件简化了控件配置过程,符合 Angular 架构原则,并提升可读性。它们在处理嵌套选项时尤其有用,例如在 dx-data-grid 中使用 dxo-pager 来配置分页选项。
<dx-data-grid [dataSource]="dataSource"> <dxo-pager [visible]="true" [showPageSizeSelector]="true" > </dxo-pager> </ dx-data-grid>
它们也适用于配置集合项,比如在 dx-toolbar 中使用 dxi-item 声明工具栏项:
<dx-toolbar> <dxi-item location="before" widget="dxButton" > </dxi-item> </dx-toolbar>
下面以 dxi-item 为例,详细讲述旧有配置组件的工作方式。这是一个“通用”组件,不仅仅用于 dx-toolbar,还广泛出现在 Form 和 List 等多个 DevExtreme 组件中。
虽然这提供了统一性(即同一组件可复用),但缺点也很明显:根据父组件的不同,Dxi-item需要完全不同的选项集,这使得精确的输入变得复杂。
下面的屏幕截图说明了IDE如何在两个不同的上下文中为dxi-item显示相同的通用属性列表。例如,form组项的预期属性与甘特图上下文菜单项中使用的属性有很大不同。
我们的核心目标之一是提供完整、健壮的 TypeScript 支持,确保所有DevExtreme组件都严格类型化,并遵循现代 TypeScript 规范。这能改善 IDE 自动补全、早期捕捉错误,并增强重构过程中的信心。
不过,要在现有 dxo- 和 dxi- 组件上强制实施严格类型是一项复杂的挑战。这可能影响大量项目,并在升级到DevExtreme的新版本后引发重大更改。而且,原有配置架构的通用性不利于类型精确化。
在 DevExtreme v24.2 中,官方引入了一套全新的配置组件——它们具备严格类型、可无缝集成到 Angular 应用中,显著提升开发体验。
每个 UI 组件现在都有其专属配置组件集,这标志着在可预测性和类型安全方面向前迈出了重要一步。以下是主要变化及其优势:
配置组件名现在包含了它们的父组件名,这提高了代码的可读性,避免命名冲突,让模板结构更易理解。
例如,以前的 dxi-item 现已改为:
这种命名约定有助于IDE识别组件上下文,并为开发人员提供更清晰的结构视图,使复杂的配置更容易导航和维护。
新的配置组件现在只包含与其特定父组件相关的属性,这消除了IDE建议一长串不相关选项的情况。例如,dxi-data-grid-column只显示适用于DataGrid列的属性。因此,IDE建议现在更加准确和有用:
大多数新的配置属性都是严格类型化的,未来也会继续完善,这意味着任何对组件API的误用都将在编译期间被捕获(早在它可能导致运行时问题之前)。
新版配置组件相较旧架构更稳健现代、抗错率更高,并更契合 TypeScript 类型系统。我们将分阶段将整个 DevExtreme Angular 生态切换至此新模型。为了确保用户的平稳和可预测的迁移,请考虑以下时间表/关键里程碑:
DevExtreme v25.1:
DevExtreme v25.2:
DevExtreme v26.1:
官方将继续支持这些用户迁移到我们的新配置组件,目标是确保用户都拥有顺利完成过渡所需的资源和指导。
DevExtreme v26.2:
所有旧配置组件将从代码库中移除。
官方目标是让过渡过程清晰、可控、安全,严格的类型支持不仅是趋势,更是可扩展、可预测、安全开发的核心。
更多产品资讯及授权,欢迎来电咨询:023-68661681
更多DevExpress线上公开课、中文教程资讯请上中文网获取
慧都是⼀家⾏业数字化解决⽅案公司,专注于软件、⽯油与⼯业领域,以深⼊的业务理解和⾏业经验,帮助企业实现智能化转型与持续竞争优势。
慧都是DevExpress的中国区的合作伙伴,DevExpress作为用户界面领域的优秀产品,帮助企业高效构建权限管理、数据可视化(如网格/图表/仪表盘)、跨平台系统(WinForms/ASP.NET/.NET MAUI)及行业定制解决方案,加速开发并强化交互体验。
本站文章除注明转载外,均为本站原创或翻译。欢迎任何形式的转载,但请务必注明出处、不得修改原文相关链接,如果存在内容上的异议请邮件反馈至chenjj@evget.com
文章转载自:慧都网HOOPS Web Platform由Tech Soft 3D推出,旨在为工程类Web应用提供一站式开发解决方案。其核心图形引擎模块HOOPS Communicator,结合HOOPS Exchange与HOOPS Publish,为开发者构建兼具高性能、可扩展性与跨平台特性的工程级Web前端提供坚实技术基础。
本文将为大家介绍DevExtreme Angular UI 控件在新版本中引入的全新严格类型配置组件,旨在提升代码可读性、类型安全性和开发效率,并规划了旧组件的逐步替换计划。
通过 HOOPS Luminate,TopSolid 的客户能在设计阶段就获得接近成品的视觉效果,缩短方案确认时间,提升成交效率。
高性能HTML5/JavaScript开发框架,利用现代Web开发堆栈构建优异性能的应用程序。
DevExpress Universal Subscription优秀的界面控件开发包,帮助企业构建卓越应用!
DevExpress DXperience Subscription高性价比的企业级.NET用户界面套包,助力企业创建卓越应用!
服务电话
重庆/ 023-68661681
华东/ 13452821722
华南/ 18100878085
华北/ 17347785263
客户支持
技术支持咨询服务
服务热线:400-700-1020
邮箱:sales@evget.com
关注我们
地址 : 重庆市九龙坡区火炬大道69号6幢
慧都科技 版权所有 Copyright 2003-
2025 渝ICP备12000582号-13 渝公网安备
50010702500608号