samedi 27 août 2016

Checkbox's checked property binding - Polymer

I am trying to bind a Polymer property to the CheckBox's checked property. However, the property's observer never gets fired, besides, the label also never shows any text.

However, I am able to execute a function every time the CheckBox gets clicked.

This is my code:

<link rel="import" href="../../components/polymer/polymer.html">

<dom-module id="check-box-example">
  <template>
    <div>
      <label>
        <template if="">Uncheck</template>
        <template if="">Check</template>
      </label><br>
      <input type="checkbox" checked="" on-click="_checkBoxClicked">Check Box
    </div>
  </template>
  <script>
    Polymer({
      is: 'check-box-example',
      checked: {
        type: Boolean,
        observer: '_checkedChanged'
      },
      _checkBoxClicked: function() {
        console.log("The Check Box was clicked.");
      },
      _checkedChanged: function(newValue, oldValue) {
        console.log("New Checkbox value: " + newValue);
      },
    });
  </script>
</dom-module>

What am I doing wrong? Thanks in advance.




Aucun commentaire:

Enregistrer un commentaire