【问题标题】:ternary expression in ng-click in angularjsng-click中的三元表达式在angularjs中
【发布时间】:2014-08-10 09:10:45
【问题描述】:

我想知道是否可以在 ng-click 属性中使用三元表达式。 如果可能,我不想使用单独的控制器功能

这是一个双按钮切换设置 - 我可以让一个简单的切换工作,但不希望再次单击“关闭”按钮重新打开。

ng-click 中的三元组不起作用(注意 ng-class 中的三元组起作用):

<button
    ng-click="allOn2==true ? allOn2 : !allOn2"
    ng-class="allOn2==true ? 'btn-green-on' : 'btn-green-off'">
ON</button>

这是一个更完整的 jsfiddle: toggler

【问题讨论】:

  • 为什么不直接使用 ng-switch?
  • 尚未了解 ng-switch,但通过简短的检查,它似乎更像是一个多选 ng-show/hide。谢谢

标签: angularjs ternary-operator conditional-operator


【解决方案1】:

你没有对三元表达式做任何事情。为了它有用,分配它:

{{ var1 }} {{ var2}}
<button
    ng-click="var1 = (allOn2==true ? allOn2 : !allOn2)"
    ng-class="{'btn-green-on':allOn2, 'btn-green-off' : !allOn2}">
ON</button>

我不确定如何将三元表达式用于 ng-class...

【讨论】:

  • 啊...你是对的。我的小提琴没有显示任何我绑定了 allOn 值的 ng-model,就像在我的项目中一样。但我明白为什么你的建议有效。我想我很困惑,因为 ng-class 要求你“什么都不做”,即只评估表达式以找到类。我需要让 on-click 显式设置 allOn 的值,我认为这只是通过对表达式的评估而发生的。谢谢!
  • 这里是更新小提琴的链接:link
  • 在三元中检查布尔值有点多余。 allOn2==true ? allOn2 : !allOn2 可以是 allOn2 = !allOn2
【解决方案2】:

您可以使用某些东西作为三元的解决方法

 ng-click="(AppliedApps!=null && Collapse('CollapsedAppliedApplications')) || 
(AppliedApps.length==0 && Collapse('CollapsedAppliedApplications'))">

【讨论】:

    猜你喜欢
    • 2017-03-25
    • 2017-09-26
    • 1970-01-01
    • 1970-01-01
    • 2015-10-03
    • 1970-01-01
    • 2014-12-25
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多