【问题标题】:AngularJs one time binding and order of values with boolean operatorsAngularJs 使用布尔运算符一次性绑定和排序值
【发布时间】:2016-04-13 13:02:05
【问题描述】:

布尔运算符的声明顺序有什么影响?

控制器:

$scope.show = false;

$scope.clickMe = function() {
  $scope.show = true;
  $scope.name = 'Name defined'
};

模板:

<button ng-click="clickMe($event)">Click Me</button>
<p ng-if="::(show && name)">show && name</p>
<p ng-if="::(name && show)">name && show</p>

点击按钮后会导致第二个p 元素以name &amp;&amp; show 的顺序显示。我知道p 元素都不应该显示为$scope.show 已经定义并且使用了一次绑定?

请戳这里:

http://plnkr.co/edit/P0E1RhNK9EPh2Pi04c9T?p=preview

【问题讨论】:

  • 可能是因为 $scope.name 尚未定义?如果你将 $scope.name 初始化为 'name undefined' 呢?

标签: javascript angularjs boolean-operations one-time-binding


【解决方案1】:

在 Angular 中,一次绑定将不断评估表达式,直到它具有非undefined 值。因此,在您的示例中,因为尚未定义名称 name &amp;&amp; show 在每个摘要上不断评估为 undefined,直到您最终设置它。如果您使用 !! 将名称强制为布尔值,那么您将获得不同的行为。来自Angular docs on expressions

一次性表达式一旦稳定就会停止重新计算, 如果表达式结果是 非未定义值(参见下面的值稳定算法)。

所以它本身不会评估一次,它会评估一次到一个值

【讨论】:

  • 感谢您的回答。我想这更像是一个一般的javascript问题。为什么name &amp;&amp; show === undefined 而不是show &amp;&amp; name
  • &amp;&amp; 运算符不会计算为布尔值,如果左侧为假,则返回该值,否则返回右侧。所以undefined &amp;&amp; falseundefinedfalse &amp;&amp; undefinedfalse。如果您的示例中的name'',那么::(name &amp;&amp; show)::(show &amp;&amp; name) 将具有相同的行为。
  • MDN docs for logical operators 非常透彻,也比我的解释好很多。
猜你喜欢
  • 2019-02-22
  • 2018-06-05
  • 1970-01-01
  • 2011-09-27
  • 2011-03-27
  • 2010-09-23
相关资源
最近更新 更多