How do you create an observable derived property in Dart / Polymer Dart?

Question

I have a component that I want to associate with another css class based on a boolean value. My component code has the following:

bindCssClass(div, "open", this, "task.isOpen"); bindCssClass(div, "closed", this, 'task.isClosed'); 

Where isOpen / isClosed are defined as follows:

 @observable bool isOpen = true; get isClosed => !isOpen; 

The question is, how can I get isClosed for observation, but based on isOpen changes? I would like to know this case, but also for cases that are more complex (for example, a string obtained from several components).

Also, is there a better way to use bindCss for such a simple case? Snap to '! Task.isOpen 'doesn't work, although it would be nice if that happened.

Answer 1

you can check the observable_getter example from dart-polymer-dart-examples github repo.

 class App extends Object with ObservableMixin { @observable DateTime timestamp; App() { bindProperty(this, const Symbol('timestamp'), () => notifyProperty(this, const Symbol('second'))); } int get second => timestamp.second; } main() { App app = new App(); new Timer.periodic(const Duration(seconds: 1), (_) { app.timestamp = new DateTime.now(); }); query('#tmpl').model = app; } 

Also check out the discussion: https://code.google.com/p/dart/issues/detail?id=12473