Javascript 移除聚合物元素后，文件上载会在实例上载时逐步添加更多文件

我有一个聚合元素，它使用构造函数值动态加载，构造函数值是从jade中的api加载的。例如：

ink(rel="import", href="/bower_components/polymer/polymer.html")
link(rel="import", href="/bower_components/core-ajax/core-ajax.html")

polymer-element(name='my-element', constructor='MyElement')
  template
     a(id='send', on-click='{{fileUpload}}')
     form(id='filePost', action='', method='POST', accept-charset='utf-8', enctype='multipart/form-data')
        input(id='fileinput', name='file', type='file')
  script.
    Polymer({
       ready: function(){
         //do something
       },
       launch:function(){
        // prepare polymer element
       },
       fileUpload:function(){
          // create XHR request and post file and on complete event exit to home view
       },
       exitUploader:function(){
          history.pushState(null, null, '/home');
          this.fire('goUrl');
          this.remove();
       },
    });

好的，这很好，就其本身而言。。。虽然我有一个基本的应用程序路由器，可以调用文件上传和网站导航。事情是这样的：

link(rel='import', href='/bower_components/polymer/polymer.html')
link(rel='import', href='/polymer/my-element') //api that returns jade to rendered html

polymer-element(name='router', attributes='attributes')
template
   div(class='container', id='appView')
script.
   (function(){
var routerView = document.querySelector('router')  
   //listen for 'navigate event' and render view
   addEventListener('goUrl',function(e){
      routerView.navigation(e);
   });
   Polymer({
      ready:function(){
        //do something
      },
      launch:function(){
        // prepare polymer element
      },
      navigation: function(){
        var self = this;
        event.preventDefault();
        event.stopPropagation();
        this.location = window.location.pathname;
        switch(true){
           case(self.location == '/maker'):
              var maker = new MyElement();
              maker.launch();
              this.$.appView.firstChild.remove();
              this.$.appView.appendChild(maker);
           break;
           case(self.location == '/anotherlocation'):
              var anyOtherElement = newPolymerElement();
              this.$.appView.firstChild.remove();
              this.$.appView.appendChild(anyOtherElement);
           break;

        }
      },
   });
   })();

好的，这也是可行的，当我移除并重新呈现一个新的“我的元素”实例时，问题就开始了。当我上传这样的表单时，它会上传一系列与以前访问中上传的文件历史相关的文件。我确信这与在polymer上正确地从dom中删除元素有关，每次查看元素时都尝试重置表单。没有骰子。我需要帮助！哈哈哈

---

提前感谢

我很确定问题在这里：

var routerView = document.querySelector('router')  
   //listen for 'navigate event' and render view
   addEventListener('goUrl',function(e){
      routerView.navigation(e);
   });

您正在生命周期挂钩之外添加侦听器，而不是在从DOM中删除元素时删除侦听器。即使元素在DOM之外，它仍会触发回调

如果您正确清理视图，问题应该得到解决

Polymer({
    ready: function(){
        // add listeners
        window.addEventListener('goUrl', this.navigation);
    },
    detached: function(){
        // remove listeners
        window.removeEventListener('goUrl', this.navigation);
    },
    ...
});

---

事实似乎并非如此，因为routerView是“my element”的父元素，并且它实际上从未从dom中移除。我试过你的方法，我想即使你没有正确地清理视图，这正是我想要找到的。。。如何正确地清理它们。在本地调用this.remove（）无法做到这一点，而且它们的作用域中没有任何事件侦听器。我会再试一次，以防我错过了什么，并让你知道竖起大拇指和谢谢