AngularJS ng-if 与 'f' 和 'F' 的问题答案

【问题标题】：AngularJS ng-if problems with 'f' and 'F'AngularJS ng-if 与 'f' 和 'F' 的问题
【发布时间】：2014-02-16 09:31:03
【问题描述】：

谁能向我解释为什么 Angularjs ngIf 指令会像 false 一样读取“f”和“F”？

不起作用的简单示例：

  <input type="text" ng-model="test" />
  <div ng-if="test">{{test}}<div>

如果你在 div 中输入 'f' 或 'F' 什么都没有显示，任何其他字母或正弦都可以。

演示：http://plnkr.co/edit/wS4PqmARXG2fsblUkLpH?p=preview

【问题讨论】：

ng-show not working even though condition is met的可能重复

标签： javascript angularjs logic

【解决方案1】：

ngIf 使用 toBoolean 检查 internally。这是toBoolean 本身：

function toBoolean(value) {
  if (typeof value === 'function') {
    value = true;
  } else if (value && value.length !== 0) {
    var v = lowercase("" + value);
    value = !(v == 'f' || v == '0' || v == 'false' || v == 'no' || v == 'n' || v == '[]');
  } else {
    value = false;
  }
  return value;
}

如您所见，不仅f 字母会出现问题，'0'、'no'、'n' 等也会出现问题。但它不会被修复。不过toBoolean 可能会在未来的版本中被删除。

在 Github 上查看此讨论：https://github.com/angular/angular.js/issues/1229?source=cc

【讨论】：

【解决方案2】：

我找到了简单的解决方案来解决我的验证问题：

<input type="text" ng-model="test" />
<div ng-if="test.length > 0">TEST: {{test}}<div>

plunker：http://plnkr.co/edit/epDLYitkhCDMJJebfSON?p=preview

【讨论】：

【解决方案3】：

我更喜欢使用双 !! 符号来模仿 JavaScript 的正常工作方式。这使您可以防止 test 为空。

<div ng-if="!!test">{{test}}<div>

【讨论】：

是的，我更喜欢。