Question

我需要显示来自相当大的Dart模型的数据。我像这样模拟我的模型层次结构：

// Tx contains a Ty
class Tx { Ty y = new Ty(); }

// Ty contains a Tz
class Ty { Tz z = new Tz(); }

// and Tz contains the field we want to display
class Tz extends Object with Observable {
  @observable String ws = 'foo';
  }

在自定义组件中，我实例化模拟模型并在调整浏览器窗口大小时更新它：

@CustomTag('x-a')
class Xa extends PolymerElement {

  Tx x = new Tx();    // instantiate my 'model'

  @observable String  w  = '-';
  @observable String  w2 = '-';

  //-----------------------------------
  Xa.created() : super.created();

  //-----------------------------------
  @override void attached() {
    super.attached();

    w = x.y.z.ws;    // attach the local variable to a variable in my model?

    window.onResize.listen((e) {              // browser window resize event
      x.y.z.ws = e.currentTarget.innerWidth.toString();  // works OK
      w2       = e.currentTarget.innerWidth.toString();  // works OK
      print('w=${w}  x.y.z.ws=${x.y.z.ws}  w2=${w2}');   // w never changes
      });
    }
  }

为了完整性，这里是组件实例化：

<polymer-element name="x-a">
  <template>
    <div>w={{w}}. w2={{w2}}.</div>
  </template>
  <script type='application/dart' src='xa.dart'></script>
</polymer-element>

w2字符串已正确更新，类层次结构中的ws字符串也是如此。但@observable String w永远不会改变。我尝试了@observable，@published，@reflectable，@PublishedProperty和他们的朋友的无数组合。有没有人知道要对类变量进行强制转换以使其可观察的咒语？

Answer 1

w = x.y.z.ws;    // attach the local variable to a variable in my model?

只是一次性作业。

我还没有自己使用过这个，但我认为这应该有用

@ComputedProperty('x.y.z.ws')
String get w => x.y.z.ws;

而不是

@observable String  w  = '-';

Answer 2

我解决了你的问题：

@CustomTag('x-a')
class Xa extends PolymerElement {

  Tx x = new Tx();    // instantiate my 'model'

  @observable String  w  = '-';
  @observable String  w2 = '-';

  //-----------------------------------
  Xa.created() : super.created();

  //-----------------------------------
  @override void attached() {
    super.attached();

    w = x.y.z.ws;    // attach the local variable to a variable in my model?

  void convert(List<ChangeRecord>changes) {
    w = changes.first.newValue;
  }

  x.y.z.changes.listen(convert);


    window.onResize.listen((e) {              // browser window resize event
      x.y.z.ws = e.currentTarget.innerWidth.toString();  // works OK
      w2       = e.currentTarget.innerWidth.toString();  // works OK
      print('w=${w}  x.y.z.ws=${x.y.z.ws}  w2=${w2}');   // w never changes
      });
    }
  }

Polymer Dart绑定到大型模型

2 个答案: