堆叠三元运算符在 Angularjs 表达式中不起作用

Question

ng-disabled="{{sroFieldStatus ? ( sroFieldStatus==2 ? true: false ):true}}"

它位于 angularJS 的 html 模板中。有时，sroFieldStatus 会变成 0,1,2 集合中的值。这个想法是 ng-disable 仅在 sroFieldStatus =1 时变为 FALSE，而不是在其 0 或 2 时变为 FALSE。

我意识到无论 sroFieldStatus 变成什么值，我所做的三元语句似乎总是被赋值为 true。

请问我哪里做错了？

谢谢

Answer 1

您不需要插值。直接使用

ng-disabled="sroFieldStatus != 1"

阅读 ngDisabled 文档

If the expression is truthy, then special attribute "disabled" will be set on the element

Answer 2

如果您使用三元运算符，请务必在冒号和问号周围放置一个 space：

ng-disabled="{{sroFieldStatus ? ( sroFieldStatus==2 ? true : false ) : true}}"

但是 == 运算符已经 return 为真或假，因此可以缩短为：

ng-disabled="{{sroFieldStatus ? (sroFieldStatus == 2 ) : true}}"

Answer 3

由于没有答案澄清它 - 我会把我在评论中写的内容收集到一个答案中。

问题是你在插入值，这意味着它将初始表达式值呈现为 HTML，并且永远不会改变，之后没有绑定，因为 ng-directives 可以评估范围对象，所以不需要对它们进行插值。

Ahhhh, so, actually, because the fact that the first level of ternary operation is already 'truthy', so regradless what afterward in the 2nd level of it, it will be considered, truthy always?

准确地说，在您的情况下，标记呈现为：

ng-disabled="true"

当然，这永远不会改变。

如果你希望 disabled 仅在值为 1 时为 false，你可以准确地这样写，而不用三元组进一步复杂化：

ng-disabled="sroFieldStatus != 1"

查看此示例以更好地理解插值和非插值版本之间的区别：

angular.module('app', [])
.controller('Ctrl', function($scope, $timeout){
  $scope.flag = false;
  $timeout(function(){
    $scope.flag = true;
  }, 3000) // simulating a change after 3 secs
})

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="app" ng-controller="Ctrl">
    <input placeholder="regular" ng-disabled="flag" />
    <input placeholder="interpolated" ng-disabled="{{flag}}" />
  </body>

Plunker version

堆叠三元运算符在 Angularjs 表达式中不起作用

Stacked Ternary Operator not functioning in Angularjs Expression

javascript

angularjs

expression

ternary-operator