如何在 Dart / Polymer Dart 中创建可观察的衍生属性？答案

【问题标题】：How do you create an observable derivative property in Dart / Polymer Dart?如何在 Dart / Polymer Dart 中创建可观察的衍生属性？
【发布时间】：2013-09-11 20:33:58
【问题描述】：

我有一个组件，我想根据一个布尔值绑定一个不同的 css 类。我的组件代码中有以下内容：

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

其中isOpen/isClosed定义如下：

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

问题是，我怎样才能让 isClosed 成为可观察的，但基于对 isOpen 的更改？我想知道这种情况，但也想知道更复杂的情况（例如，从多个组件派生的字符串）

另外，对于这种简单的情况，有没有更好的方法来使用 bindCss？绑定到 '!task.isOpen' 不起作用，但如果能绑定就好了。

【问题讨论】：

标签： dart dart-webui polymer

【解决方案1】：

您可能需要查看 dart-polymer-dart-examples github 存储库中的 observable_getter 示例。

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;
}

也可以在https://code.google.com/p/dart/issues/detail?id=12473查看讨论

【讨论】：