2

聚合物 js 文档说您必须侦听 WebComponentsReady 事件才能知道何时设置了聚合物元素。Dart 中的等价物是什么？

这是我的模板：

 <template id="order_name" bind repeat>
   <div class="accordion-group">
     <div class="accordion-heading">
       <a class="accordion-toggle" data-toggle="collapse" data-parent="#order_list" href="#collapseOne">
         {{commonName}} ({{scientificName}})
       </a>
     </div>
     <div id="collapseOne" class="accordion-body collapse">
       <div class="accordion-inner">
         ...
       </div>
     </div>
   </div>
 </template>

这是主要的：

void main() {
  OrderList().then((order_data) {
    query("#order_name").model = order_data;
    print (queryAll(".accordion-heading")); //null
  }).catchError((err) => print(err));

  query("#my-button").onClick.listen((Event e) {
     print (queryAll(".accordion-heading")); //[div,div]
  });
}

OrderList 是 HttpRequest.getString() 的包装器并返回一个未来。我的想法是使用 WebComponenentsReady 之类的事件来了解模板何时已完全实例化。基本问题是如何获得 main 中的 .accordion-heading div，以便将听众附加到它们？

4

2 回答 2

1

我假设您正在使用boot.js. 如果你是，它们应该在你程序进入的时候被初始化main()。

于 2013-08-12T23:40:05.090 回答
1

根据规范（https://www.dartlang.org/articles/web-ui/spec.html#main-script）：

...您不能查询条件节点和迭代节点的子节点。...要检索组件实例，您需要将查询推迟到事件循环结束，例如使用 Timer.run(f)。

所以上面的代码需要修改成这样：

void main() {
  OrderList().then((order_data) {
    query("#order_name").model = order_data;
    print (queryAll(".accordion-heading")); //null

    Timer.run( () => print (queryAll(".accordion-heading"))); //[div,div]

  }).catchError((err) => print(err));

  query("#my-button").onClick.listen((Event e) {
     print (queryAll(".accordion-heading")); //[div,div]
  });
}
于 2013-08-15T16:38:46.713 回答