Search code examples
dartdart-polymerpaper-elements

Setting the label of a paper-icon-button

Previous to the current paper-element release 0.6.., I was able to do the following

  <paper-icon-button
    id='add-btn'
    class='margin-l-t-r-2'
    label='LANGUAGE'
    icon='menu'
    on-click='{{toggle}}'>
  </paper-icon-button>

and the button would contain both the icon and the label. Now the label is not displayed, only the icon on the button. Any help is appreciated in how can I get both label and icon on the button.

Solution

  • Yeah, this has been different in PolymerJS for a while now. They're starting to do things as child elements more often, like this:

    <paper-button>
  <core-icon icon="favorite"></core-icon>
  label goes here
</paper-button>

    Docs here: https://www.polymer-project.org/docs/elements/paper-elements.html#paper-button

    Note that the <paper-icon-button> was probably always intended to be used just for icons. If you want an icon and a label, <paper-button> is the way to go, as per my example.