使用 Elvis 运算符
在 Angular 中,当数据为 null 时,我们经常会遇到显示问题,因为无法在 null 值上调用属性或方法。为了解决此问题,我们可以使用 Elvis 运算符(?.)。
例如,如果我们要在模板中显示一个用户的姓名,但是该用户可能不存在:
Hello, {{ user.name }}!
如果 user 为空,那么当尝试访问 name 属性时,应用程序将崩溃。相反,我们可以使用 Elvis 运算符来避免此问题:
Hello, {{ user?.name }}!
这个问题同样存在于模板中的 *ngFor 循环中:
-
{{ user.name }}
如果 users 数组中的任何一个用户的 name 属性是 null,应用程序将抛出异常。我们可以使用 Elvis 运算符来避免此问题:
-
{{ user?.name }}