Angular中subscribe直接传类方法报Cannot set properties of undefined错误原因

这个现象是完全符合预期的，根本原因是JavaScript/TypeScript的this上下文绑定规则：

• 当你直接把类方法this.updateName作为回调传入subscribe时，方法会脱离原有的类实例上下文。严格模式下，Observable触发回调执行updateName时，函数内部的this会是undefined，此时执行this.name = name相当于给undefined设置属性，自然就抛出了对应的报错。
• 你写法1使用箭头函数可以正常运行，是因为箭头函数没有独立的this，它的this会继承定义位置的外层上下文（也就是当前组件实例），调用this.updateName时能正确指向组件实例完成赋值。

如果想要保持简洁的写法，有两种常用的修复方案：

1. 用bind方法手动绑定上下文：

.subscribe(this.updateName.bind(this))

2. 把类方法定义为箭头函数属性，自带实例上下文绑定：

updateName = (name: string): void => {
  this.name = name;
}

这样修改后直接把this.updateName传给subscribe也可以正常运行。

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