I have the following code where a 2-way binding is expected between first_name and the property val.
<!DOCTYPE html>
<link rel="import" href="packages/polymer/polymer.html">
<link rel="import" href="packages/paper_elements/paper_input.html" >
<polymer-element name='paper-input-snippet'>
<template>
<div on-mouseout="{{zoom}}">
<paper-input
label="First" floatinglabel
error="Invalid input"
id="first_name"
value='{{val}}'>
</paper-input>
<paper-input
label="Middle" floatinglabel
error="Invalid input"
id="middle_name">
</paper-input>
<paper-input
label="Last" floatinglabel
error="Invalid input"
id="last_name">
</paper-input>
</div>
</template>
<script type="application/dart">
import 'package:polymer/polymer.dart';
import 'dart:html';
import 'package:paper_elements/paper_input.dart';
@CustomTag( 'paper-input-snippet' )
class PaperInputSnippet extends PolymerElement
{
@observable String val = 'Tommy';
String receiver = '';
PaperInputSnippet.created() : super.created();
void zoom( Event e, var detail )
{
print ( e.target );
print ( val);
}
@override
void attached()
{
super.attached();
receiver = this.dataset['receiver'];
}
}
</script>
</polymer-element>
However, changing the value of the paper-element does not print the new value, only the intialized value is printed.
Is this a bug or am I doing something wrong>