AngularJS - 内联css样式呈现

Question

是否可以/以及如何/使用角度变量来编写内联css样式？

<div style="background: transparent url({{eventInfo.eventHeaderImg}}) top center no-repeat;"></div> 

这是我的输出

"NetworkError: 404 Not Found - http://test/eventInfo.eventHeaderImg"

所以我看到它没有呈现这个值。

我知道可以在控制器中更改它，但是我的方法是否可行？

Answer 1

您应该使用ngStyle：

示例：http://plnkr.co/edit/qT8skZzTwXjrh3Ye5mr9?p=preview

<div ng-style="{ background: 'transparent url({{ eventInfo.eventHeaderImg }}) top center no-repeat' }"></div> 

Answer 2

这对我来说很有用：

<div ng-style="{ 'background': 'transparent url(' + eventInfo.eventHeaderImg + ') top center no-repeat' }"></div>

Answer 3

你正在“写”一个错误的网址，这就是为什么你有404（未找到）错误。

根据this plunker，如果您$scope设置得很好，则可以在style属性中打印正确的数据。

请注意，您的eventInfo范围变量必须是地图/对象。

Answer 4

您不需要在那里使用双卷发支架。