我有一个具有这种样式的组件:[ngStyle]="{background: 'url(http://somedomain/api/'+event.EventID+'/otherUrlItems/image) no-repeat center center' }”
组件在服务器上,第一个添加为背景图像。我应该如何为那些没有任何关联图像的组件添加默认背景图像?
更新: 这对我有用:
[ngStyle]="{'background': 'url(http://somedomain/api/'+event.EventID+'/otherUrlItems/image) no-repeat center center, url(https://placeimg.com/640/480/any) no-repeat center center'}"
最佳答案
如果您的应用程序不知道是否有可用于此事件的背景,您可以尝试多个背景图像(最后设置默认图像)
另一种可能性是向您的 DOM 元素添加一个类,并直接在 css 中设置背景图像。然后 ngStyle 添加的样式将覆盖 css。
但副作用是您将在客户端浏览器中收到 404 请求。最好的选择是 IMO 在您的后端托管一个默认背景,并在没有可用图像时提供它
如果您的 Angular 应用程序知道图像是否可用,请查看 Brian 评论中的帖子
关于html - 切换背景图片 - Angular 2,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47889153/