用相机拍摄的照片作为 div 背景图像 Ionic 3答案

【问题标题】：Picture taken with camera as div background image Ionic 3用相机拍摄的照片作为 div 背景图像 Ionic 3
【发布时间】：2018-07-22 14:34:39
【问题描述】：

我有一张照片，由手机的相机拍摄，结果类似于http://localhost:8080/var/mobile/Containers/Data/Application/XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX/tmp/cdv_photo_001.jpg。

无论我尝试什么，我都无法为给定的 div 设置背景图像。（在该 div 上使用内联 CSS）。

所以： <div style="background: url('{{ imageUrl }}');"> 不起作用（div 有高度和宽度，当我将背景设置为 yellow 时，我看到了黄色背景。

同时： <img src="{{ imageUrl }}"/> 正在工作。

另外：当我尝试使用来自 Google 的随机图片时，例如 https://www.w3schools.com/w3css/img_lights.jpg，它会将该图片显示为背景图片。

对于 CSS 中背景图像的 URL 格式是否有一些限制？

【问题讨论】：

【解决方案1】：

在ionic中，可以通过以下两种方式实现：
1]使用style.property绑定如下：

<div [style.backgroundImage]="imageUrl"></div>

2] 使用ngStyle绑定如下：

<div [ngStyle]="{'background-image' : imageUrl}"></div>

【讨论】：