Question

我有这个HTML代码：

<textarea id="text-to-convert" on-change="change" value="{{text}}"></textarea>

这个飞镖码：

import "dart:html";
import 'package:polymer/polymer.dart';

@CustomTag('dictionary-converter')
class DictionaryConverter extends PolymerElement with ObservableMixin {

  @observable String text = "Initial text";

  void change(Event event, var detail, TextAreaElement textElement) {
    print(textElement.value);
    print(text);
  }

}

在这种情况下，on-change事件仅会不时触发。（到目前为止我还没弄清楚。）

当我删除value={{text}}绑定时，每次更改textare时都会正确触发事件。

我忽略了什么或这是一个错误吗？

Answer 1

使用Polymer 0.8+，您可以使用* yourFieldName **已更改。当被观察的属性发生变化时，将调用Changed方法。由于String text是双向数据绑定，因此更改textarea的值将更改String text的值并调用textChanged方法。这适用于您的原始代码，不需要ObservableBox

import "dart:html";
import 'package:polymer/polymer.dart';

@CustomTag('dictionary-converter')
class DictionaryConverter extends PolymerElement with ObservableMixin {

  @observable String text = "Initial text";

  textChanged(oldValue) {
    print("textarea: ${this.shadowRoot.query("textarea").value}");
    print("text: ${text}");
  }
}

Answer 2

显然我必须使用in this stackoverflow question

所述的ObservableBox

所以我最终得到了：

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

@CustomTag('dictionary-converter')
class DictionaryConverter extends PolymerElement with ObservableMixin {

  ObservableBox csvText = new ObservableBox("Initial text");

  ready() {
    csvText.changes.listen(convert);
  }

  void convert(x) {
    String text = csvText.value;
  }

}

绑定值时，on-change事件未正确触发

2 个答案: