无法读取未定义角4的属性“名称”
提问于 2017-05-21 02:55:26
我试图在组件模板中打印一个值。
但是我得到了上面的错误Cannot read property 'name' of undefined
我已经从这个问题的代码中删除了额外的内容。我想访问第一行的详细信息。
组件文件
import {
Component
} from '@angular/core';
import {
Person
} from './person';
import {
getPersonDetailsService
} from './person.service';
@Component({
selector: 'my-app',
template: `
{{data[0].name}}
`
})
export class AppComponent {
data: Person[] = [];
ngOnInit(): void {
this.getPersonDetailsService.getData()
.then(data => this.data = data.slice(1, 5));
}
}
回答 4
Stack Overflow用户
回答已采纳
发布于 2017-05-21 02:59:07
我认为您应该首先检查在浏览器中打印数据时是否定义了数据。
{{data[0]?.name}}由于数据最初没有定义，因此无法访问它的name属性。
角度安全导航操作符(？)是一种流畅和方便的方法，可以防止属性路径中的空值和未定义值。在这里，如果当前的currentHero是空的，则防止视图呈现失败。
还可以使用&&条件检查变量是否为空。
{{data[0] && data[0].name}}
Stack Overflow用户
发布于 2017-05-21 02:57:04
从您的错误消息来看，data似乎是未定义的(或者是空的)-并且错误发生在以下一行：
{{data[0].name}}也许在那之前输入一个console.log(data)来验证到底发生了什么
Stack Overflow用户
发布于 2017-05-21 03:01:56
尝试将其放入构造函数中，而不是ngOnInit：
getPersonDetailsService.getData() ...此外，您还需要在模板中进行一些检查，以防“数据”长度不超过0 {{data[0]?.name}}。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/44096004
复制相关文章
腾讯云开发者
