Angular中subscribe返回对象访问指定属性返回undefined如何解决

错误原因 #

核心问题是属性名拼写不匹配：

• 接口返回对象的实际键名为 submitGbtFrom（末尾为From，字母r结尾）
• 你代码中读取的属性名写为了submitGbtForm（末尾为Form，字母m结尾）
  二者拼写不一致，自然读取结果为undefined。

修复代码 #

直接把读取属性的名称改成和返回键名完全一致即可：

this.service.submitGbtForm(formValue)
  .subscribe((status) => {
    let a = status; // a = {submitGbtFrom: 'success'}
    console.log(a, 'SINGLE FOEM');
    console.log(a.submitGbtFrom, 'SINGLE FOEM'); 
    console.log(a["submitGbtFrom"], 'SINGLE FOEM');
    //  this.router.navigate(['/success/',this.ticketId]);
},(err) =>  console.log(err))

同类问题排查技巧 #

后续遇到类似对象属性读取为undefined的情况，可以先打印Object.keys(目标对象)查看对象所有真实键名，核对是否存在拼写、大小写、多空格之类的差异，快速定位问题。

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