在 Angular 项目中使用 ngx-mask 时，启用 showMaskTyped="true" 后 @ 字符无法输入，而其他字母、数字及特殊字符（如 $, #, ~）均正常；根本原因是 @ 被默认特殊字符列表拦截，需显式清空 specialCharacters 配置以解除限制。
在 angular 项目中使用 ngx-mask 时，启用 `showmasktyped="true"` 后 `@` 字符无法输入，而其他字母、数字及特殊字符（如 `$`, `#`, `~`）均正常；根本原因是 `@` 被默认特殊字符列表拦截，需显式清空 `specialcharacters` 配置以解除限制。
当你在 Angular 应用中使用 ngx-mask（v17.0.4）并配置自定义掩码模式（如 mask="BBBBBBBBBB"）与正则规则（B: { pattern: /[a-zA-Z0-9@$%~]/ }）时，理论上 @ 应被允许输入。但实际运行中，若启用了 [showMaskTyped]="true"，@ 却被静默过滤——这并非正则匹配问题，而是 ngx-mask 的内部字符校验逻辑所致。
ngx-mask 默认维护一个内置的 specialCharacters 数组（包含 @, !, *, +, -, =, ?, /, etc.），用于识别和处理“非标准输入”。当 showMaskTyped="true" 开启时，库会双重校验：既检查 patterns，也检查输入字符是否存在于 specialCharacters 列表中——若不在该列表且未显式声明为“允许的特殊字符”，则可能被拦截（尤其在某些版本中对 @ 存在特殊处理逻辑）。
✅ 正确解决方案是显式覆盖默认行为，将 specialCharacters 设为空数组：
<input id="otp" class="form-control" name="otp" formcontrolname="otp" mask="BBBBBBBBBB">
并在组件中保持你的自定义模式：
this.customPatterns = {
B: { pattern: new RegExp('[a-zA-Z0-9@$%~]') }
};
⚠️ 注意事项：
- specialCharacters="[]" 必须作为绑定属性（带方括号）传入，不可写成字符串 "[]"；
- 不要省略 [dropSpecialCharacters]="false"，否则即使 @ 匹配模式，也可能被后续清理逻辑移除；
- 若后续需支持更多特殊符号（如 *, !），可将其加入 specialCharacters 数组（如 ['@', '*', '!']），而非仅依赖 patterns；
- showMaskTyped="true" 本身不修改输入逻辑，但它会激活更严格的实时字符验证流程，因此必须同步显式声明所有允许的特殊字符范围。
该方案已在 Angular 17 + ngx-mask 17.0.4 环境下验证有效，兼顾掩码提示与完整字符输入能力，是当前最简洁、可靠的修复方式。
