TypeScript报错：Property 'emailAddress' does not exist on type 'BaseModel' 问题排查求助

为什么会出现Property 'emailAddress' does not exist on type 'BaseModel'错误？ #

这个错误的核心是TypeScript的类型不匹配：

• 你定义的PagedModel类中，items属性的类型被固定为BaseModel[]，而BaseModel里完全没有emailAddress这个字段；
• 虽然你在代码里把res.items断言成UserProfileDropdownDto[]赋值给了transactionUserTable.data，但在调用res.items.forEach(...)时，TypeScript仍然会严格按照PagedModel的定义来识别items的类型——也就是BaseModel[]，自然会报错找不到emailAddress。

另外还有个潜在问题：你的UserProfileDropdownDto类里也没有声明emailAddress字段，就算你绕开类型检查，运行时也可能因为读取不存在的属性出问题。

为什么forEach循环无法正常工作？ #

其实forEach本身是能执行的，但因为TypeScript的类型检查报错，会导致编译失败，代码根本没机会运行到循环这一步；就算你强行忽略错误编译运行，TypeScript会认为item.emailAddress是不存在的，可能引发undefined相关的运行时错误。

具体解决方案 #

1. 把PagedModel改成泛型类（推荐，最规范的做法）

让PagedModel支持泛型，这样就能根据不同的接口返回数据，指定items的具体类型，而不是固定用BaseModel：

// base-model.ts
export class BaseModel {
  // 保留你现有的注释或属性
}

export class PagedModel<T extends BaseModel> {
  firstItemOnPage: boolean;
  lastItemOnPage: boolean;
  totalItemCount: number;
  items: T[];

  constructor(isFirstPage: boolean, isLastPage: boolean, totalItems: number, itemList: T[]) {
    this.firstItemOnPage = isFirstPage;
    this.lastItemOnPage = isLastPage;
    this.totalItemCount = totalItems;
    this.items = itemList;
  }
}

然后修改服务方法的返回类型，指定泛型参数为UserProfileDropdownDto：

// Component A 服务代码
getUserProfileTableDropdown( id: number, page: number, pageSize: number, searchString: string, sortKey: string[], sortOrder: string[] ): Observable<PagedModel<UserProfileDropdownDto>> {
  const params = new HttpParams()
    .set('id', id.toString())
    .set('page', page.toString())
    .set('pageSize', pageSize.toString())
    .set('searchString', searchString)
    .set('sortKey', JSON.stringify(sortKey) || '')
    .set('sortOrder', JSON.stringify(sortOrder) || '');
  return this.httpRequestService.get<PagedModel<UserProfileDropdownDto>>( `${apiBaseUrl}/table/profiles`, params );
}

这样在subscribe里，res.items就会被TypeScript识别为UserProfileDropdownDto[]，emailAddress的报错自然就消失了。

2. 完善UserProfileDropdownDto的字段

因为你在代码里用到了item.emailAddress，必须在UserProfileDropdownDto里声明这个字段，同时记得继承BaseModel（因为泛型要求T extends BaseModel）：

export class UserProfileDropdownDto extends BaseModel {
  id: number;
  fullName: string;
  roleDisplay: string;
  firstName:string;
  lastName:string;
  emailAddress: string; // 新增这个字段
  isChecked: boolean = false;
}

3. 临时应急方案（不推荐长期使用）

如果暂时不想改动泛型结构，可以在forEach时给item做类型断言，绕开TypeScript的检查：

(res.items as UserProfileDropdownDto[]).forEach(item => {
  if(item.emailAddress && selectedNewUser.findIndex(x => x.emailAddress === item.emailAddress) !== -1){
    item.checked = true;
  }
});

但这种方式相当于关闭了TypeScript的类型校验，容易隐藏潜在问题，只适合临时调试用。

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