googlearchive / TemplateBinding

TemplateBinding Prolyfill
290 stars 61 forks source link

support input type=number? #131

Closed jmesserly closed 11 years ago

jmesserly commented 11 years ago

given HTML

<input type="number" value="{{myinteger}}" />

and JS:

var model = { myinteger: 123 };

The value of model.myinteger will start as a number but end up as a string. Is this intended?

(This was reported as polymer.dart issue 12223)

here's a complete snippet to illustrate:

<!DOCTYPE html>
<html>
  <head><script src="mdv.js"></script></head>
  <body>
    <template id="greeting" if='{{}}'>
      <p>Hello, the type of myinteger is {{msg}}</p>
      <input type="number" value="{{myinteger}}"  />
    </template>
  <script>
  document.addEventListener('DOMContentLoaded', function() {
    var t = document.getElementById('greeting');
    var model = { msg: 'world', myinteger: 123 };
    t.model = model;

    // Needed to detect model changes if Object.observe
    // is not available in the JS VM.
    Platform.performMicrotaskCheckpoint();

    setInterval(function() {
      model.msg = typeof model.myinteger;
      Platform.performMicrotaskCheckpoint();
    }, 100);

  });
  </script>
  </body>
</html>
arv commented 11 years ago

I don't see how it can not end up string. MDV binds to the value property which is a string. Maybe if you bind to valueAsNumber instead?

jmesserly commented 11 years ago

good point. yeah it would have to be valueAsNumber. Or using some kind of filter in the Polymer expr syntax?

jmesserly commented 11 years ago

closing as dupe of https://github.com/Polymer/mdv/issues/84