Angular中HTML里addressData.address_type属性显示为undefined问题

看起来你遇到的问题核心在于组件类变量的访问权限以及必要模块的配置，我来帮你一步步排查解决：

1. 修正变量的访问修饰符 #

Angular的模板只能访问组件类中**public（公共）**的成员，你声明的private addressData在模板里是无法直接访问的，这是导致值显示为undefined的最常见原因。

修改你的控制器代码，把private改成public，同时确保变量完成初始化：

// 调整访问权限为public，并明确初始化对象
public addressData: { address_type:'personal', state: 'State'} = { 
  address_type:'personal', 
  state: 'State'
};

2. 确保导入FormsModule #

使用[(ngModel)]双向绑定需要在组件所属的模块中导入FormsModule，否则绑定会失效，也可能导致值异常：

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms'; // 导入FormsModule
import { YourComponent } from './your-component.component';

@NgModule({
  imports: [BrowserModule, FormsModule], // 添加到imports数组
  declarations: [YourComponent],
  bootstrap: [YourComponent]
})
export class AppModule { }

3. 优化模板的select控件 #

你的模板代码基本没问题，可以给默认的-- Select --选项加上selected属性（不过ngModel绑定初始值后会自动选中对应选项，这一步是可选优化）：

<select id="address_type" name="address_type" [(ngModel)]="addressData.address_type">
  <option value="select" disabled> -- Select -- </option>
  <option value="personal">personal</option>
  <option value="business">business</option>
</select>

做完以上几步，你的addressData.address_type应该就能正常在select控件中显示初始值personal了。

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