Angular JS - 带有动态数据的条件内联样式

时间:2016-03-21 04:32:11

标签: javascript html css angularjs

我想显示有条件依赖于动态值的样式。例如:

<div ng-style="!obj.prop ? 'width : 0;' : 'width: {{ obj.val1 / obj.val2 }}%;'"></div>

是否可以使用ng-class或ng-style?

1 个答案:

答案 0 :(得分:1)

使用这个重构版本,你会没事的:

<div ng-style="{ 'width' : !obj.prop ? 0 : obj.val1 / obj.val2 + '%' }"></div>

您的问题是您在需要表达式的指令中使用插值({{}})。

作为一个好的经验法则,请记住,大多数内置的AngularJS指令需要表达式而不是插值。一些与插值有关的指令:ngHrefngSrc