Polymer 1.0 hidden$ attribute negate operator

Question

Just trying to apply negate operator, it seems not working, any input on this appreciated.

it is definitely not a blocker, i can write a compute method to handle it, but negate operator makes more sense to me at-least.

Below snippet not working, if i remove the negate operator it works in opposite way of what i expect.

<div hidden$="{{!productDetails}}">
  My Hidden Content
</div>

Documentation (not a comprehensive one)

https://www.polymer-project.org/1.0/docs/devguide/templates.html

In a data binding section of polymer documentation: <div hidden="{{!enabled}}"></div> ie. there is no '$'. — grohjy
Are you sure that your productDetails has type: Boolean? If not, that could be your issue. — Whyser
Below answer looked bit more cleaner way to handle this specific case, thank you for the input guys. — Srini

MrK MrK · Accepted Answer · 2015-11-14T11:50:44

You could use DOM if

<dom-module id="user-page">

  <template>

    All users will see this:
    <div>{{user.name}}</div>

    <template is="dom-if" if="{{user.isAdmin}}">
      Only admins will see this.
      <div>{{user.secretAdminStuff}}</div>
    </template>

  </template>

  <script>
    Polymer({
      is: 'user-page',
      properties: {
        user: Object
      }
    });
  </script>

</dom-module>

Polymer 1.0 hidden$ attribute negate operator

2 Answers