如何在函数中正确使用[ngStyle]
如何在函数中正确使用[ngStyle]
提问于 2018-06-01 07:27:29
我有以下错误，它不断返回调试控制台
HomeComponent.html:33错误TypeError:无法在Object.eval as updateDirectives的HomeComponent.getImageEvent (home.component.ts:73)读取未定义的属性'url‘
HomeComponent.html
<div [ngStyle]="getImageEvent(i)">home.component.ts
getImageEvent(index: number): object {
return {'background-image': 'url(' + this.events[index].images[0].url + ')'};
}回答 2
Stack Overflow用户
回答已采纳
发布于 2018-06-01 08:56:54
当您看到：
无法读取未定义的属性“url”
这意味着有些东西是不确定的。这意味着，您试图读取属性的对象(在这种情况下为'url')尚未定义。
尝试使用某种isset()。在javascript中，有几种方法可以对其进行排序。
我对数组的建议是myArr[0] !== undefined，对于对象，你可以使用hasOwnProperty('url')。或者只使用||的简短版本：
getImageEvent(index: number): object {
const img = this.events[index].images[0] || {}; // is array defined?
const imgSrc = img.url || '';
return {'background-image': 'url(' + imgSrc + ')'};
}阅读有关javascript isset() here的更多信息
Stack Overflow用户
发布于 2018-06-01 09:56:59
您可以在模板中使用?运算符执行相同的操作。?操作符使它之后的所有内容都是可选的，这样您在尝试读取未定义的内容时就不会出错。
<div [style.background-image]="'url('+events[i].images[0]?.url+')'">页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/50634162
复制相关文章
相似问题
腾讯云开发者
