PrimeNg表格配置Global Filter全局过滤器报TS2531空对象错误如何解决？

这个TS2531报错是TypeScript严格空值校验规则触发的：$event.target 的默认类型为 EventTarget | null，TypeScript无法确定它一定存在、且是带value属性的输入框元素，因此判定直接访问$event.target.value存在空值访问风险，抛出错误。

下面提供3种可行的修复方案，优先推荐前两种：

• 方案1：模板内直接做类型断言+可选链（适配Angular 12及以上版本）
  直接修改input的input事件绑定代码即可：

<input type="text" pInputText (input)="dt1.filterGlobal(($event.target as HTMLInputElement)?.value, 'contains')" placeholder="Search keyword" />

as HTMLInputElement 是告诉TS这个target一定是输入框元素，可选链?. 会在target为空时自动终止取值，避免空指针报错。

• 方案2：把过滤逻辑抽到组件TS文件中处理（兼容所有Angular版本，更易维护）
  第一步先修改模板的事件绑定：

<input type="text" pInputText (input)="onGlobalFilter($event, dt1)" placeholder="Search keyword" />

第二步在对应的component.ts文件中添加处理函数，注意提前从primeng/table导入Table类型：

import { Table } from 'primeng/table';

// ...组件类内部
onGlobalFilter(event: Event, table: Table) {
  const inputEle = event.target as HTMLInputElement;
  if (inputEle) {
    table.filterGlobal(inputEle.value, 'contains');
  }
}

• 方案3：关闭模板严格空校验（不推荐，会丢失类型校验能力）
  如果不需要模板的严格类型校验，可以在项目的tsconfig.json中修改配置：

{
  "angularCompilerOptions": {
    "strictTemplates": false
  }
}

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