如何用ngstyle改变不透明度?

sna*_*ggs 21 angularjs

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

$scope.currentPage = 0;
Run Code Online (Sandbox Code Playgroud)

现在,在控制器中没有任何额外的代码(方法)我想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>
Run Code Online (Sandbox Code Playgroud)

但我得到错误:

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

Fiddle

我错过了什么吗?

谢谢,

[编辑]

我可以写 ng-style="myOpacity"

在控制器中:

$scope.myOpacity = {
    'opacity': ($scope.currentPage == 0)?0.4:1
};
Run Code Online (Sandbox Code Playgroud)

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

mus*_*_ut 32

更新:从版本1.1.5开始,Angular确实支持模板中的三元运算符.

Angular不支持模板中的三元运算符.但是,您可以使用穷人的三元运算符:

 ng-style="{opacity : ((currentPage == 0) && '0.4') || '1'}">   
Run Code Online (Sandbox Code Playgroud)


小智 31

实际上,AngularJS 1.1.5有三元运算符(参见https://github.com/angular/angular.js/commit/6798fec4390a72b7943a49505f8a245b6016c84b),所以如果你使用版本> = 1.1.5,你应该可以使用:

ng-style="{'opacity' : currentPage == 0 ? 0.4 : 1}"
Run Code Online (Sandbox Code Playgroud)