[Proposal] Add transformer support to data binding

[jolleekin]

Polymer 0.5

class IntToStringTransformer extends Transformer<String, int> {
  String forward(int i) => i != null ? '$i' : '';

  int reverse(String s) => int.parse(s, onError: (_) => null);
}

class MyElement extends PolymerElement {
  MyElement.created() : super.created();

  @observable
  int count;

  final IntToStringTransformer int2string = new IntToStringTransformer();
}

<polymer-element name="my-element">
  <template>
    <input type="text" value="{{count | int2string}}" />
  </template>
</polymer-element>

Polymer 1.0

class MyElement extends PolymerElement {
  MyElement.created() : super.created();

  @Property(observer: 'countChanged')
  int count;

  @Property(observer: 'countStringChanged')
  String countString;

  @reflectable
  void countChanged(_, __) {
    set('countString', count != null ? '$count' : '');
  }

  @reflectable
  void countStringChanged(_, __) {
    set('count', int.parse(countString, onError: (_) => null));
  }

<dom-module id="my-element">
  <template>
    <input type="text" value="{{countString::change}}" />
  </template>
</dom-module>

In Polymer 1.0, transformer behaviors must be manually implemented for each property or path. If there are tens or even hundreds of properties or paths that require transformers, it's just too painful to implement.

[jolleekin]

I had to create this transformer_binding package to solve this problem. However, this package cannot work with dynamically generated bindings wrapped in template[is=dom-if] and template[is=dom-repeat].

[jolleekin]

Any update???

[jakemac53]

This package is a wrapper around Polymer JS, and does not handle any template parsing logic. Please refile the request there https://github.com/polymer/polymer/issues/new.