CODEWITHSUNDEEP
polymerpolymer-2.x
jehna1
jehna1

Reputation: 3130

How to override property's value:true with an attribute in Polymer

In polymer if I have a property called value with type Boolean and default value true:

static get properties() {
  return {
    value: {
      type: Boolean,
      value: true
    }
  }
}

Is there any way to set the value to false with HTML attribute?

e.g. all of these samples intrepret the value property as true:

<my-element></my-element>
<my-element value></my-element>
<my-element value="false"></my-element>
<my-element value="[[false]]"></my-element>
<my-element value="{{false}}"></my-element>
<my-element value="{{!constructor}}"></my-element>

Here's a sample codepen: http://codepen.io/anon/pen/KWdWRm

Upvotes: 1

Views: 358

Answers (1)

tony19
tony19

Reputation: 138276

No, unfortunately you cannot bind a false value to a Boolean property, as the Polymer docs explain:

For a Boolean property to be configurable from markup, it must default to false. If it defaults to true, you cannot set it to false from markup, since the presence of the attribute, with or without a value, equates to true. This is the standard behavior for attributes in the web platform.

If this behavior doesn't fit your use case, you can use a string-valued or number-valued attribute instead.

Upvotes: 4

Related Questions