Question

到目前为止我在控制器中：

$scope.currentPage = 0;

现在，在控制器中没有任何其他代码（方法）我想在0.4

时在图像上设置不透明度currentPage ==0

所以我写道：

<div ng-controller="ctrlRead">
  <div class="pagination no-margin ">
    <ul>
      <li ng-class="{disabled: currentPage == 0}">
         <a href=""
          ng-class="{disabled: currentPage == 0}">
             <i class="icon-fast-backward"
             ng-style="{opacity : (currentPage == 0)?'0.4':'1'}">
             </i>
        </a>
      </li>
    </ul>
  </div>
</div>

但我得到错误：

Unexpected next character  at columns 29-29 [?] in expression [{opacity : (currentPage == 0)?'0.4':'1'}]

Fiddle

我错过了什么吗？

谢谢，

[编辑]

我可以写ng-style="myOpacity"

并在控制器中：

$scope.myOpacity = {
    'opacity': ($scope.currentPage == 0)?0.4:1
};

但它需要控制器中的其他代码

Answer 1

更新：从版本1.1.5开始，Angular确实支持模板中的三元运算符。

Angular在模板中不支持三元运算符。但是，你可以使用穷人的三元运算符：

 ng-style="{opacity : ((currentPage == 0) && '0.4') || '1'}">

Answer 2

实际上，AngularJS 1.1.5有三元运算符（参见https://github.com/angular/angular.js/commit/6798fec4390a72b7943a49505f8a245b6016c84b）所以如果你使用版本＆gt; = 1.1.5，你应该可以使用：

ng-style="{'opacity' : currentPage == 0 ? 0.4 : 1}"

如何用ngstyle改变不透明度？

2 个答案: