使用ng-style取决于angularjs条件，是否添加背景

Question

我试图根据条件添加背景网址样式，因此我尝试使用数据-ng-style但由于某些原因无法使其工作，我不知道是什么我做错了。

data-ng-style="true : {'background-image': 'url(' + getThumbnailUrl(item) + ')'}, false : {}[item.thumbnailClass === undefined]"

基本上，我想要做的是，如果未定义thumbnailClass，则将background-image设置为data-ng-style，否则不执行任何操作。

添加JSFiddle http://jsfiddle.net/Lvc0u55v/5666/ 想象一下，即使fafa是布尔值，如果为真，则应用样式，如果为false，则不执行任何操作。

如何在AngularJS中实现这一目标？感谢。

Answer 1

你的语法有点偏。这应该工作。

data-ng-style="{'background-image': (item.thumbnailClass === undefined) ? 'url(' + getThumbnailUrl(item) + ')' : ''}"

Answer 2

您可以使用ng-class来实现此目的。也许你可以尝试这样的事情：

在你的CSS中

.bgImage {
    background-image: url('someImage.jpg');
}

在HTML标签中（我以div为例）：

<div ng-class="{bgImage: thumbnailClass !== undefined}">
   <h3> Something </h3>
</div>

Answer 3

你可以在控制器中做这样的事情

if(yourcondtion){
  $scope.myStyle = {
    "background-color" : "coral",
  };
} else {
   $scope.myStyle = {};
}

在HTML中，您可以输入ng-style =＆＃34; myStyle＆＃34;