Angular双向绑定空Address对象报错，定义get/set属性时触发TS2345类型错误

嘿，我完全懂你碰到的麻烦——当Student的address属性是null或者undefined时，模板里直接用[(ngModel)]="selected.address.street"会直接炸锅，而你尝试用getter兜底的时候又踩了个递归的小坑，触发了TS2345类型错误，对吧？

咱们先理清楚问题根源：

• 第一个问题是JavaScript的常规坑：当你访问selected.address.street时，如果address是null/undefined，JS会直接抛出“无法读取null的street属性”的错误，Angular模板也没法处理这种情况。
• 你之前写的getter犯了个小错误：在get address()里又返回了this.address，这会导致无限递归调用getter本身，TypeScript当然会给你报错，而且逻辑上也走不通。

下面给你一套完整的解决方案：

1. 先补全Address类（假设你已经定义了，这里给个参考） #

export class Address {
  street?: string;
  city?: string;
  zipCode?: string;
  // 其他你需要的地址属性
}

2. 修正Student类的getter/setter逻辑 #

核心是用一个私有变量来存储实际的address值，避免递归调用：

export class Student {
  id: number;
  firstname: string;
  lastname: string;
  age: number;
  // 用私有变量存储address，允许初始为undefined
  private _address?: Address;

  get address(): Address {
    // 如果私有变量为空，先创建一个空的Address实例并赋值
    if (!this._address) {
      this._address = new Address();
    }
    // 返回实际存储的address（保证永远不会是null/undefined）
    return this._address;
  }

  set address(value: Address | undefined) {
    // 允许外部设置为Address实例或者undefined
    this._address = value;
  }
}

3. 模板里正常使用双向绑定就行 #

现在你原来的模板代码完全不用改，直接用：

<span class="field mr-3">
  <input pInputText id="student-address-street" placeholder="Student Street" [(ngModel)]="selected.address.street"/>
</span>

为什么这样能解决问题？ #

• 当selected.address原本是undefined时，第一次访问getter会自动创建一个空的Address实例并存在私有变量里，模板里的street属性永远能拿到有效的对象，不会再报错。
• 双向绑定修改street时，实际修改的是私有变量_address里的属性，数据会正确同步到Student实例中。
• 彻底避免了之前的递归问题，TypeScript的类型错误自然就消失了。

另外提个替代方案：如果你不想改类的结构，也可以在模板里用安全导航操作符?.，比如[(ngModel)]="selected.address?.street"，但这个方案有个缺陷——如果address原本是undefined，用户输入的内容不会被保存（因为没有实际的Address对象来存储），所以还是用getter/setter的方案更可靠。

备注：内容来源于stack exchange，提问作者velocity