基于条件改变元素属性

Question

有没有办法确定要在元素上呈现哪个属性？例如，如果我的count变量大于5，我想要将div设置为绿色背景，否则给它一个ui-view指令？

让我们用伪代码写一个不切实际的例子

<div ng-if="count > 5 ? {style='background: green'} : {ui-view='home'}">

</div>

这是合理的吗？我可能会以错误的方式接近它，但我想知道这是否可以或应该完成（我认为自定义指令可能会有所帮助，但我希望尽可能保持轻量级）

感谢任何帮助或讨论！

Answer 1

是的，ng-class是为那个

而制作的

<div ng-class="{{ 'green' : (count > 5) ; 'red' : (count != 5) }}">

</div>
 // where green and red is class name not style

您还可以使用变量作为类名

<div class="base-class" ng-class="myVar">Sample Text</div>

或ng-style  http://plnkr.co/edit/pCplLBymY1nmX7Bmb0uO?p=preview

  <span ng-style=" count > 5 ? { 'background-color':'red' } : { 'background-color':'green' }" >Sample Text</span>

Answer 2

您可以这样做：

<div ng-if="myCondition"></div>
<div ng-if="!myCondition" ui-view></div>

为避免代码重复，我建议使用ng-include：

<ng-include src="template"></ng-include>