CODEWITHSUNDEEP
dartdart-polymer
Daniel Robinson
Daniel Robinson

Reputation: 14898

is it possible to publish matching getter and setter properties in polymer.dart?

I have been playing about with the stopwatch example from the polymer.dart tutorials. I've altered the @Observable String counter = '00:00'; to:

String _counter = '00:00';
@published void set counter (String s){ _counter = s; }
@published String get counter => _counter;

I set it to @published so I can set the counter attribute in the html tag and this worked great when I initially just changed it to @Published String counter = '00:00'; but having split it into separate getter and setter properties it no longer works at all, is it possible to do something like this? I want to have some custom logic performed when a bound value is changed either programmatically or via user/html changes.

Upvotes: 2

Views: 703

Answers (1)

Günter Zöchbauer
Günter Zöchbauer

Reputation: 658077

The @observable is only necessary on the getter.

I guess what you want to do is

// additional functionality in the setter
String _counter = '00:00';
@PublishedProperty(reflect: true) 
String get counter => _counter;
void set counter (String s){ 
  _counter = s;  
  // do something ...
}

void attached() {
  new async.Timer.periodic(new Duration(seconds:1), (_) {
    var oldVal = _counter;
    var time = new DateTime.now();
    _counter = '${time.minute}:${time.second}';
    // explicitely notify Polymer about the changed value
    notifyPropertyChange(#counter, oldVal, _counter);
  });
}

or alternatively 

// additional functionality in xxxChanged
@PublishedProperty(reflect: true) 
String counter = '00:00';

void counterChanged(oldVal, newVal){ 
  // do something ...
}

another one is 

// use readValue/writeValue to fix some timing issues
@PublishedProperty(reflect: true) 
String get counter => readValue(#counter);
void set counter (String s){ 
  writeValue(#counter, s); 
  // do something ...
}

//in the constructor
writeValue(#counter, '00:00');

@PublishedProperty(reflect: true) ensures that the HTML attribute gets updated with the field value.

If you find this confusing you are not alone ...

Upvotes: 2

Related Questions