简体   繁体   English

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

[英]Polymer 2.0 dom-if rendering template even though if condition is false

I am having trouble figuring out why my inner <dom-if" if="{{_isShowCategory(category.name)}}> template is rendering even though the condition is false. 我很难弄清楚为什么我的内部<dom-if" if="{{_isShowCategory(category.name)}}>模板为什么呈现,即使条件为假。 I print out the boolean result and the if condition correctly evaluates to false when category.name is 'account' , but still, the template renders. 我打印出布尔结果,并且当category.name'account'if条件正确评估为false ,但是模板仍然呈现。

<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
  }

just change the IF statement in return (categoryName !== "account"); 只需更改返回的IF语句即可(categoryName!==“ account”); The "!" “!” symbol is the logical NOT operator, that means that whatever is true will became false and videversa, in your case is even trickier because you have: symbol是逻辑上的NOT运算符,这意味着任何正确的事物都将变为false,并且在您的情况下videversa更加棘手,因为您拥有:

IN THE CASE THE CONDITION IS TRUE 在这种情况下是正确的

-- (categoryName === "account") = TRUE -(categoryName ===“帐户”)= TRUE

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

-- -- -- !Boolean(categoryName === "account") = FALSE, because of NOT symbol "!" ---!Boolean(categoryName ===“ account”)= FALSE,因为不是符号“!”

IN THE CASE THE CONDITION IS FALSE 在这种情况下是虚假的

-- (categoryName === "account") = FALSE -(categoryName ===“帐户”)= FALSE

-- -- Boolean(categoryName === "account") = TRUE, because Boolean("anythingWithAValidValue") converts anything different then null/undefined in TRUE otherwise FALSE --布尔值(categoryName ===“ account”)= TRUE,因为布尔值(“ anythingWithAValidValue”)会转换不同于NULL / undefined的任何值,否则为TRUE,否则为FALSE

-- -- !Boolean(categoryName === "account") = FALSE, because of NOT symbol "!" --!Boolean(categoryName ===“ account”)= FALSE,因为不是符号“!” as I mentioned before. 正如我之前提到的。

Btw this is not a Polymer Issue, please change the tag of your question, JS/JAVASCRIPT is more appropriated. 顺便说一句,这不是聚合物问题,请更改您的问题标签,更适合使用JS / JAVASCRIPT。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM