Polymer 2.0 dom-if渲染模板,即使条件为false也是如此

时间:2017-07-10 16:26:15

标签: javascript polymer polymer-2.x dom-if

即使条件为假,我也无法弄清楚为什么我的内部<dom-if" if="{{_isShowCategory(category.name)}}>模板正在渲染。我打印出布尔结果,当iffalse时,category.name条件正确评估为'account',但模板仍会呈现。

<dom-if if="[[_shouldRenderDrawer]]">

<template>
    <!-- Two-way bind `drawerOpened` since app-drawer can update `opened` itself. -->
    <app-drawer opened="{{drawerOpened}}" swipe-open tabindex="0">

      <a name="account" href="/account">ACCOUNT</a>

      <iron-selector role="navigation" class="drawer-list" selected="[[categoryName]]" attr-for-selected="name">
        <dom-repeat items="[[categories]]" as="category" initial-count="4">

          <!-- NOTE: I've also tried <dom-if if="{{_isShowCategory(category.name)}}> but I get the same result -->

          <template is="dom-if" if="{{_isShowCategory(category.name)}}">
              <span style="color:black">{{_isShowCategory(category.name)}}</span>
              <a name="[[category.name]]" href="/[[category.name]]">[[category.title]]</a>
          </template>

        </dom-repeat>
      </iron-selector>
    </app-drawer>
  </template>
</dom-if>

  _isShowCategory(categoryName){
    return !Boolean(categoryName === "account");
    // I've also tried return !(categoryName==='account'), which returns the same result as the above
  }

1 个答案:

答案 0 :(得分:1)

只需更改IF语句即可 return(categoryName!==“account”); “!” symbol是逻辑NOT运算符,这意味着无论什么是真的都会变成虚假和videversa,在你的情况下甚至更棘手,因为你有:

在这种情况下,条件是正确的

  

- (categoryName ===“account”)= TRUE

     

- - 布尔值(categoryName ===“account”)= TRUE

     

- - - !Boolean(categoryName ===“account”)= FALSE,因为NOT符号“!”

在这种情况下,条件是错误的

  

- (categoryName ===“account”)= FALSE

     

- - Boolean(categoryName ===“account”)= TRUE,因为Boolean(“anythingWithAValidValue”)会转换任何不同的东西   null / undefined为TRUE,否则为FALSE

     

- - !Boolean(categoryName ===“account”)= FALSE,因为NOT符号“!”正如我之前提到的那样。

顺便说一下,这不是聚合物问题,请更改您的问题标签,JS / JAVASCRIPT更合适。