angular: "NG0600: Writing to signals is not allowed in a `computed`"
0
悬赏园豆：30
[已解决问题]
解决于 2025-06-29 15:21
在 angular 19 中使用 nz-tree-select 时遇到的一个问题
下面是 component 模版文件中与问题相关的 nz-tree-select 定义代码
<nz-tree-select #treeSelect
[nzExpandedKeys]="expandedKeys()"
[nzDisplayWith]="displaySelectedNode">
</nz-tree-select>
expandedKeys 是一个 signal 变量
protected expandedKeys = signal<string[]>([]);
报错发生在下面的代码中倒数第3行设置 expandedKeys 值的时候
displaySelectedNode = (node: NzTreeNode) => {
const titles = [node.title];
const keys = [node.key];
let parent = node.getParentNode();
while (parent) {
titles.push(parent.title);
keys.push(parent.key)
parent = parent.getParentNode();
}
this.expandedKeys.set(keys.reverse());
return titles.reverse().join(' / ');
}
错误信息如下
NG0600: Writing to signals is not allowed in a `computed`.
请问如何解决这个问题？
问题补充：
如果不用 Signals，会出现下面的报错
NG0100: ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: '[]'. Current value: '["2264939","2264940","2264944"]
最佳答案
0
通过 angular.love 上的这篇博文 Expression changed error – Causes and workarounds 知道了，出现这个问题是由于在 changes detection 过程中修改了状态值
解决方法是将 this.expandedKeys.set 操作放到 ngAfterViewChecked 中执行，displaySelectedNode 中只保存新的状态值
新增一个保存状态值的成员变量
private expandedKeysChanges: string[] = [];
displaySelectedNode 中改为
this.expandedKeysChanges = keys.reverse();
ngAfterViewChecked 中更新状态值
ngAfterViewChecked() {
this.expandedKeys.set(this.expandedKeysChanges);
}
