CODEWITHSUNDEEP
polymer
好吃仙人
好吃仙人

Reputation: 147

Polymer bind data to attribute

I want to bind a Polymer variable to an attribute, which I can set it to true or false to control the display of my content. However it seems that it doesn't work. is this the right way to bind it ??

css:

.nav-menu[active="true"]{
        display: -webkit-flex;
        display: flex;
        justify-content: space-between;
      }
.nav-menu[active="false"]{
        display: none;
      }

template:

<iron-selector class="nav-menu" selected="0" active="[[isActive_menu]]">

Upvotes: 0

Views: 123

Answers (1)

Kuba Šimonovsk&#253;
Kuba Šimonovsk&#253;

Reputation: 2043

You are missing important thing. $. Always whenever you want to set attribute of element (not property. Property is something different) and you are using bindings, you need to add $ before =.

In your case:

<iron-selector class="nav-menu" selected="0" active$="[[isActive_menu]]">

In your case you are setting active as property of iron-selector. If you inspect that element in your browser, you will see there is no active attribute

more info about bindings: https://www.polymer-project.org/1.0/docs/devguide/data-binding

Upvotes: 1

Related Questions