我无法异步更新Dart Polymer元素。
假设我有一个包含标签和文本输入的简单元素。
模板
<polymer-element name="control-text">
<template>
<label for="{{id}}">{{label}}</label>
<input id="{{id}}" value="{{value}}" type="text" />
</template>
<script type="application/dart" src="control-text.dart"></script>
</polymer-element>
飞镖文件
@CustomTag("control-text")
class ControlTextElement extends PolymerElement {
@observable String id;
@observable String value = "Value";
@observable String label = "Label";
ControlTextElement.created() : super.created();
}
我想从应用程序的初始化中异步更新创建和更新这个元素Timer
。
void main() {
ControlTextElement element;
// Add the element to a form
initPolymer().run(() {
element = new Element.tag("control-text");
querySelector("#form").children.add(element);
});
// Function that updates the value of the element
Function updateValue = (Timer t) {
element.value += "Foo"; // Append "Foo" to the current value
print(element.value);
};
// Start updating the value every 2 seconds
Timer timer = new Timer.periodic(new Duration(seconds: 2), updateValue);
}
正确的值会打印在控制台中,但元素本身不会更新。手动更改文本框的值后,控制台将打印新值。
观察者设置正确,但他们没有接受异步更改。我错过了什么?