How do I add JavaScript DOM API to my Polymer element?

Question

I want my element to have specific JavaScript API. For example like HTMLInputElement that have checked property, I want my element to have a property that you can only set binary values to it and I have callbacks to changes.

Answer 1

This described in detail in the documentation.

Properties and methods are defined on the element's prototype using the Polymer() constructor.

Polymer('my-element', {
  name: 'Mohsen',
  isChecked: false,
  isCheckedChanged: function() {
    console.log('I am checked?', this.isChecked);
  },
  ...
});

To define a property as boolean, make sure to hint its type.

Use <prop>Changed watchers to be notified when the <prop> changes.