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

标签 javascript html css angularjs

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

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

这可以使用 ng-class 或 ng-style 来实现吗?

最佳答案

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

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

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

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

关于javascript - Angular JS - 具有动态数据的条件内联样式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36123191/

相关文章:

javascript - Firebase数据重复问题

javascript - 如何将实时数据从nodejs服务器推送到AngularJS?

html - 如何使用CSS使div背景图像中的div元素响应

css - 将图像对齐到 h3 的右侧

php - 单击复选框时页面跳转到顶部 css

php - 使用 <a> 元素使整个 block 可点击

javascript - Push is not a function JavaScript 错误

javascript - TypeScript 无效的重载签名 - 与实现不兼容

javascript - 谷歌AdSense广告未显示

javascript - 如何通过 IE 使用 JavaScript 导航到 URL?