Skip to main content
 首页 » 编程设计

angularjs之如何使用ngstyle更改不透明度

2025年02月15日26lexus

到目前为止,我在 Controller 中:

$scope.currentPage = 0; 

现在,在 Controller 中没有任何其他代码( 方法)的情况下,我想在设置 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"
并在 Controller 中:
$scope.myOpacity = { 
    'opacity': ($scope.currentPage == 0)?0.4:1 
}; 

但它需要 Controller 中的其他代码

请您参考如下方法:

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

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

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