Fatal编程技术网
  • css/
  • 使用内嵌CSS设置组件样式-Ionic2，AngularJS

使用内嵌CSS设置组件样式-Ionic2，AngularJS

css angular typescript ionic2

使用内嵌CSS设置组件样式-Ionic2，AngularJS,css,angular,typescript,ionic2,ionic3,Css,Angular,Typescript,Ionic2,Ionic3,我试图使用构造函数中的动态变量集为背景图像附加一个内联CSS规则，如下所示： <div style="background-image: url('{{backgroundImage}}');"> ... </div> 但是，当元素呈现到屏幕时，内联CSS规则将被忽略。 我尝试使用Angular的ng style，但它返回“无法绑定到'ng style'，因为它不是'div'的已知属性” 我还尝试在@组件声明中设置样式，如中所述，但在我的情况下这不会起作用，因为我需

我试图使用
构造函数中的动态变量集为
背景图像
附加一个内联CSS规则，如下所示：


<div style="background-image: url('{{backgroundImage}}');">
  ...
</div>


但是，当元素呈现到屏幕时，内联CSS规则将被忽略。

我尝试使用Angular的
ng style
，但它返回“无法绑定到'ng style'，因为它不是'div'的已知属性”

我还尝试在
@组件
声明中设置
样式
，如中所述，但在我的情况下这不会起作用，因为我需要
backgroundImage
变量是动态的
 由于Ionic2（或仅Ionic）构建在AngularJS（非AngularJS）之上，您可以这样做：


<div [ngStyle]="{ background: 'url(' + backgroundImage + ')' }"></div>






或




Second one在Ionic 3上为我工作，因为[style.borderColor]=“stat.color”没有插值。很高兴听到@Ruffo:）

<div [ngStyle]="{ background: 'url(' + backgroundImage + ')' }"></div>



<div [style.background]="'url(' + backgroundImage + ')'"></div>