在angularjs中使用三元运算符来设置元素的属性

Posted 2023-02-23

【中文标题】在angularjs中使用三元运算符来设置元素的属性

【英文标题】：Using ternary operator in angularjs to set an attribute on an element

【发布时间】：2018-01-03 02:52:55

【问题描述】：

我正在使用 angularjs 1.6 并且需要使用特定的 css 库，如果按钮定义如下，则该库将禁用按钮：

<button disabled="">
   My button
</button>

如果已定义，将启用按钮：

<button disabled="">
   My button
</button>

我正在尝试根据控制器内服务中属性的最新值启用/禁用它，但即使 someProperty 已定义，该按钮始终显示为已启用......有什么想法吗？

<button  ctrl.myService.getData().someProperty ? '' : 'disabled=""' >
   My button
</button>

【问题讨论】：

使用 ng-disabled="someProperty"

正如 vivz 所说

<button ng-disabled="ctrl.myService.getData().someProperty">My button</button> 不会禁用按钮.. 即使someProperty 不存在

【参考方案1】：

尝试使用

<button ng-disabled="ctrl.myService.getData().someProperty ? 'disabled': '' ">
   My button
</button>

【参考方案2】：

我们可以使用ng-disabled 属性来实现这一点。所以它就像：

<button ng-disabled="ctrl.myService.getData().someProperty ? true : false">
   My button
</button>

如果有帮助，请告诉我。