Question

我正在Angular中开发一个过滤应用程序。我用数据填充Mat-Table，然后设置一些过滤器以减少显示的项目数量。

我的“项目”界面具有可选的属性“位置？”，这导致我遇到问题：

export interface Project {
  id: number;
  name: string;
  location?: string;
}

我在常量中添加了一些项目

export const PROJECTS: Project[] = [
  { id: 1, name: 'Hey', location: 'London' },
  { id: 2, name: 'Blub', location: 'Rome' },
  { id: 3, name: 'noloc'}
];

但是我在过滤时遇到问题：

proj.location.toLowerCase().indexOf(this.locationData.toLowerCase()) > -1

上面的行返回错误（因为'noloc'没有指定的位置，因此我试图将函数应用于' undefined '）：

错误TypeError：无法读取未定义的属性“ toLowerCase”

解决此问题的最佳方法是什么？

现在我所能想到的就是用一个类替换我的接口，并在构造函数中确保如果未指定位置，则设置一个空字符串。但是我想一定有一些更聪明/更聪明的方法来解决这个问题。

Answer 1

在您应用toLowerCase()

之前，我认为这是一个简单的null检查

proj && proj.location && proj.location.toLowerCase().indexOf(this.locationData.toLowerCase()) > -1

在接口的可选属性上使用“ toLowerCase”

1 个答案: