Angular中修改第三方组件的样式 – zorro日期选择器右端不对齐的BUG

共计 327 个字符，预计需要花费 1 分钟才能阅读完成。

在一列上同时使用 zorro 的日期选择器和 input 组件会出现右端不对齐的 BUG（nzSpan 设置为一样）

上图中 3 个表单项：单据日期、开票、交货方式，nzSpan 数值是一样的，可以看到日期选择器和下面的“交货方式”右端没有对齐
在浏览器控制台中层层展开后到达下面的路径：

可以看到 ant-calendar-picker 是日期选择器组件的官方提供的样式，在该样式下手动追加属性 width:100%，右端就可以对齐了，那么接下来只要应用到源码中就好了
结果在当前组件的 css 文件中直接.ant-calendar-picker{width:100%;} 是没有效果的，要这样使用才有效：::ng-deep .ant-calendar-picker{width:100%;}