删除和重新添加聚合物元素实例的正确方法是什么？答案

【问题标题】：What is the right way to remove and re-add a polymer element instance?删除和重新添加聚合物元素实例的正确方法是什么？
【发布时间】：2014-04-24 12:50:49
【问题描述】：

删除和重新添加聚合物元素实例会破坏数据绑定。调用 prepareElement() 会重新连接所有内容，但这是最好的方法吗？

给定这个 HTML，使用 click-counter example

<body>           
  <click-counter id="click_counter_id" count="5"></click-counter>    
</body>

和代码

main() {
  Logger.root.level = Level.ALL;
  Logger.root.onRecord.listen((LogRecord rec) {   
    print('${rec.loggerName}: ${rec.level.name}: ${rec.time}: ${rec.message}');
  });

  initPolymer().run(() {

    Polymer.onReady.then((_) {            

      var elem = querySelector('#click_counter_id');
      var parent = elem.parent;

      elem.remove();         

      new Timer(new Duration(seconds:1), () {

        parent.children.add(elem);

        // This reconnects the bindings. Is it correct?
        (elem as PolymerElement).prepareElement();
      });
    });
  });            
}

一切都似乎没问题。但随后我们会收到一条警告：

polymer.events: FINE: event: [button].on-click => [click-counter].increment())
polymer.unbind: FINE: [click-counter] cancelUnbindAll
polymer.unbind: WARNING: [click-counter] already unbound, cannot cancel unbindAll
polymer.events: FINE: event: [button].on-click => [click-counter].increment())

有没有更好的方法来删除和重新添加聚合物元素实例？

【问题讨论】：

可能是stackoverflow.com/questions/20805350的副本

标签： dart dart-polymer polymer

【解决方案1】：

我自己没有尝试过，但它似乎是合理的。希望作者不介意回复Detached observables when re-using element.

查看了 polymer.js 信息位后，我发现有一个 cancelUnbindAll 函数必须在创建元素或将 preventDispose 属性设置为 true 时调用。

对于任何可能需要这样做的人，在 Dart 实现中，您必须在 super 调用之后调用 leftView 函数中的 cancelUnbindAll，如下所示：

void detached() {
    super.leftView();
    this.cancelUnbindAll(preventCascade: true);
}

或者，您可以简单地覆盖自定义元素中的 preventDispose 属性：

bool get preventDispose => true;

编辑

还有一个preventDispose见https://github.com/Polymer/polymer/issues/312

【讨论】：