【问题标题】:Making all class properties observable in a dart PolymerElement template使所有类属性在 dart PolymerElement 模板中可观察
【发布时间】:2014-05-03 22:43:22
【问题描述】:

在以下示例中,当单击更新类按钮时,{{testClass.someProperty}} 会更新为新类的 someProperty,但更新 testClass.someProperty 不会更新模板中的 {{testClass.someProperty}} .

我认为使 TestClass @observable 可以使其属性可观察,并且在更新属性时,模板中的属性会发生变化。

将 TestElement.testClass.someProperty 绑定到 {{testClass.someProperty}} 以及作为扩展,将任何类的属性绑定到 Polymer Element 模板的正确方法是什么?

test_class.dart

library test;

import "package:polymer/polymer.dart";

@observable
class TestClass extends ObservableBase {
  String someProperty;
  TestClass(this.someProperty);
}

test_element.dart:

library test_element;

import "package:polymer/polymer.dart";
import "test_class.dart";

@CustomTag("test-element")
class TestElement extends PolymerElement with ObservableMixin {
  @observable
  TestClass testClass = new TestClass("original");

  void updateClass() {
    testClass = new TestClass("xyz");
  }
  void updateProperty() {
    testClass.someProperty = "foobar";
  }
}

test_element.html

<polymer-element name="test-element">
  <template>
    {{testClass.someProperty}}
    <button on-click="updateProperty">Update Property</button>
    <button on-click="updateClass">Update Class</button>
  </template>
  <script type="application/dart" src="test_element.dart"></script>
</polymer-element>

test.dart

library test;

int main() {

}

test.html:

<!DOCTYPE html>

<html>
  <head>
    <link rel="import" href="test_element.html" />
    <script src="packages/polymer/boot.js"></script>
  </head>
  <body>
    <test-element></test-element>
    <script type="application/dart" src="test.dart"></script>
  </body>
</html>

【问题讨论】:

    标签: dart


    【解决方案1】:

    我通过将@observable 从类移动到属性来使其工作。我认为用 @observable 注释类应该与将所有属性注释为可观察的相同,但这不起作用:

    test.dart

    图书馆测试;

    import "package:polymer/polymer.dart";
    
    class TestClass extends ObservableBase {
      @observable
      String someProperty;
      TestClass(this.someProperty);
    }
    

    【讨论】:

    • 我遇到了同样的问题。它似乎在不扩展 ObservableBase 的情况下工作(只需在属性上添加 @observable 注释)。你填错了吗?
    • 我实际上最近根本无法让它工作,但我没有花太多时间在它上面。我没有提交错误,因为我并不完全清楚它应该如何工作,而且我不明白@observable@published 之间的区别。我会在今天晚些时候尝试并花一些时间在它上面可能会向其他邮件列表提交一些东西以确保我理解它。
    • 是的,我也发现了。除了第一次尝试(例如构造函数)之外,它不适用于 getter-s。在这一点上,我认为观察者不可靠。
    猜你喜欢
    • 2017-09-07
    • 2013-12-05
    • 1970-01-01
    • 2013-09-11
    • 1970-01-01
    • 2012-12-14
    • 1970-01-01
    • 1970-01-01
    • 2020-06-05
    相关资源
    最近更新 更多