3

メッセージを数秒間表示してから消える単純な Web コンポーネントを作成しようとしています。最初の 2 つの文字列を表示しましたが、インフォーマル メソッドを呼び出しても何も起こりません。

<element name="x-informador" constructor="InformadorComponente" extens="div">
      <template>
        <ul>
          <template iterate="mensaje in mensajes">
            <li>{{mensaje}}</li>
          </template>
        </ul>
      </template>
      <script type="application/dart">

import 'dart:async';
import 'package:web_ui/web_ui.dart';
import 'package:web_ui/watcher.dart' as watcher;

class InformadorComponente extends WebComponent {

  @observable
  List mensajes = ['uno', 'dos'];

  const int DURACION_MENSAJE = 7;

  void informar(String informe) {
    mensajes.add(informe);
    watcher.dispatch();

    print('antes del Timer: ');
    print(mensajes);

    new Timer(new Duration(seconds: DURACION_MENSAJE), () {
      mensajes.removeAt(0);
      watcher.dispatch();

      print('paso del mensajes, first');
      print(mensajes);
    });
  }
}
      </script>
    </element>

これらの印刷物はすべてブラウザーで正しく表示されますが、リストは同じままで、何も起こりません。そのリストを文字列に変更し、非公式メソッドを呼び出すときに値を割り当てると、UI が更新されますが、このリストを使用すると何も表示されません。

ブラウザにエラーは表示されず、外部から、外部の Web コンポーネントからインフォーマルを呼び出しています。

ヒントはありますか？

4

1 に答える 1

4

Make a Map or a List observable in Web UI をご覧ください。

toObservable()基本的に、リストを監視可能にするために、新しい (そしてこれまでのところ、ほとんど文書化されていない) 関数を使用したいと考えています。Observables は、オブジェクトの変更を監視する好ましい方法として watcher.dispatch() に取って代わります。

于 2013-04-11T00:21:33.413 に答える