为什么从ng-show =“!emptyArray”和ng-hide =“ emptyArray”得到不同的结果?

发布于 2021-02-01 09:58:54

我一直都在思考ngShowngHide互相扮演布尔对象。但是,这种想法ngShow被涉及空数组时的意外行为所动摇。

这是一个演示小品。为什么ng- show="!emptyArray"表现不佳ng-hide="emptyArray"

关注者
0
被浏览
117
1 个回答
  • 面试哥
    面试哥 2021-02-01
    为面试而生,有面试问题,就找面试哥。

    因为[] !== false。您可以将长度值强制boolean改为!!

    <div ng-hide="!!emptyArray.length">emptyArray is falsy, so do not hide this.</div>
    <div ng-show="!!!emptyArray.length">!emptyArray is truthy, so show this.</div>
    

    编辑:

    AngularJS的指令hideshow取决于toBoolean()用于评估传入值的函数。这是toBoolean()的源代码:

    function toBoolean(value) {
      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;
    }
    

    您可以在JS控制台中验证以下代码:

    >var emptyArray = [];
    >toBoolean(emptyArray)
    false
    >toBoolean(!emptyArray)
    false
    

    这就解释了为什么。由于何时直接emptyArray传递到toBoolean(),因此它会评估正确的结果false。然而,当!emptyArray被传递到toBoolean(),它不评估到true,因为!emptyArrayfalse自己。

    希望能帮助到你。



推荐阅读
知识点
面圈网VIP题库

面圈网VIP题库全新上线,海量真题题库资源。 90大类考试,超10万份考试真题开放下载啦

去下载看看