NG-ZORRO Ant Design 中InputNumber信号错误分析与解决方案

问题背景

在NG-ZORRO Ant Design组件库升级到19.0.0版本后，部分开发者反馈在使用新版基于信号的nz-input-number组件时遇到了应用崩溃的问题。这个问题特别出现在当开发者在表单控制逻辑中尝试修改输入值时，系统会抛出"NG0600: Writing to signals is not allowed in a computed"的错误。

技术原理分析

这个问题的根源在于Angular的信号机制与表单控制逻辑之间的交互方式。在Angular的信号系统中，计算属性(computed)是只读的，不允许在其中直接修改其他信号的值。当开发者在表单验证或值变更逻辑中尝试修改表单控件的值时，如果这个逻辑恰好在计算属性的上下文中执行，就会触发这个保护机制。

具体场景还原

在典型的使用场景中，开发者可能会在表单验证方法中检查输入值，并根据某些条件修改该值。例如，当检测到输入值为'1'时，可能出于业务逻辑需要再次将其设置为'1'。这种看似无害的操作在基于信号的实现中就会导致上述错误。

解决方案

NG-ZORRO官方提供了两种解决方案：

1. 临时解决方案：使用Angular提供的untracked函数包裹表单值修改操作。这个函数可以确保在修改信号值时不会触发依赖追踪机制，从而避免在计算属性中修改信号的问题。

import { untracked } from '@angular/core';

validate() {
  if (this.formGroup.get('number')!.value == '1') {
    untracked(() => {
      this.formGroup.get('number')!.setValue('1' as any);
    });
  }
  return true;
}

2. 永久解决方案：等待官方发布包含修复的补丁版本。这个问题已经被标记为将在下一个补丁版本中修复。

最佳实践建议

1. 在升级到使用信号的组件版本时，应当全面测试表单交互逻辑
2. 避免在计算属性或副作用函数中直接修改表单值
3. 对于复杂的表单逻辑，考虑将值修改操作放在明确的用户操作处理函数中
4. 如果必须在一定条件下自动修改值，确保这些操作不会形成循环依赖

总结

NG-ZORRO Ant Design向信号系统的迁移带来了性能优势，但也引入了新的使用约束。理解Angular信号系统的工作原理对于正确使用这些新组件至关重要。开发者应当注意信号系统的只读特性限制，合理组织代码结构以避免类似问题。