Angular中数组重新赋值未触发变更检测，视图未更新如何解决？

以下是不同前端框架下的常见原因，可对应你的技术栈排查：

Vue 2 场景 #

• 首先检查Persons对象初始化时是否已声明address属性：Vue 2的响应式系统无法监听后续追加的对象属性变更，如果address是后续动态添加的属性，直接赋值不会触发更新，需要改用this.$set(Persons, 'address', result.address)执行赋值。
• 排查变量拼写错误：你的赋值操作用的是Persons.address，但问题描述里提到要更新的是person.address，大小写不一致会导致模板绑定的变量和实际赋值的变量不是同一个，自然不会更新。

Vue 3 场景 #

• 如果你用ref定义Persons变量，赋值时需要加.value后缀：Persons.value.address = result.address，漏写.value只会修改ref包裹的外层对象，不会触发响应式更新。
• 如果你用选项式API开发Vue 3，规则和Vue 2一致，同样需要检查属性是否提前声明、变量拼写是否正确。

Angular 场景 #

• 如果你的组件开启了ChangeDetectionStrategy.OnPush变更检测策略，只有输入属性引用变更、组件内部触发DOM事件、手动调用变更检测时才会刷新视图。可以确认result.address是全新的数组引用，或者手动注入ChangeDetectorRef后调用detectChanges()强制触发更新。

通用排查点 #

• 赋值后打印console.log(Persons.address)确认赋值逻辑确实执行，排除异步请求失败、代码执行顺序错误导致赋值没生效的问题。
• 确认模板中绑定的变量和你赋值的变量属于同一个作用域，没有出现赋值的是局部变量、模板绑定的是组件实例变量的问题。

内容的提问来源于stack exchange，提问作者NullException