ng-zorro组件库日期组件禁止手动输入日期

最新推荐文章于 2023-12-14 17:16:03 发布

卖芒小壮

最新推荐文章于 2023-12-14 17:16:03 发布

阅读量759

点赞数 1

CC 4.0 BY-SA版权

分类专栏： Angular 文章标签： angular web前端 javascript

本文链接：https://blog.youkuaiyun.com/qq_40313825/article/details/94362658

Angular 专栏收录该内容

1 篇文章

订阅专栏

本文解决ng-zorro日期控件在区间选择时的手动输入问题，通过隐藏输入框避免时间输入错误，确保时间排序正确，采用jQuery库实现nzOpenChange事件监听。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在使用ng-zorro组件库中的日期控件时，遇到区间输入日期时间的一系列bug;例如在手动后输入日期时间时起始日期晚于开始日期时不会触发 modelchange事件；点击查询时查不到数据

在这里插入图片描述

如上图 在选择日期后  使用手动输入的开始时间晚于终止时间时不会触发change事件  所以无法进行时间排序；所以现在的一个需求思路就是禁止手动输入时间；具体思路步骤如下：
思路： 使用时间控件的nzOpenChange事件，在日期面板打开时操作dom将输入框隐藏掉 ；做一个假象，就不可以手动输入了！
步骤：
1.使用jq库；引入jq   安装命令：npn install jquery
2.使用日期组件的nzOpenChange事件，在日期面板打开时nzOpenChange操作dom将输入框隐藏掉即可