我的模板模型破坏togglePanel（）？

Question

为什么t.model = model打破了我的p.togglePanel()？

 var t = document.querySelector('template') 
     t.addEventListener('template-bound', function() { 
      t.model = model //<= this breaks my togglePanel? 
      var p = document.querySelector('core-drawer-panel') 
      p.togglePanel() //<= does not work see above 
     }) 

我的模型看起来像这样，需要配置我的聚合物表。请注意，表本身工作，其togglePanel()停止工作。

 var data = [ 
      {fruit: 'apple', alice: 4, bill: 10, casey: 2, average: 5.3, total: 16 }, 
      {fruit: 'banana', alice: 0, bill: 4, casey: 0, average: 1.3, total: 4 }, 
      {fruit: 'grape', alice: 2, bill: 3, casey: 5, average: 3.3, total: 10 }, 
      {fruit: 'pear', alice: 4, bill: 2, casey: 8, average: 4.6, total: 14 }, 
      {fruit: 'strawberry', alice: 0, bill: 14, casey: 1, average: 5, total: 15 } 
     ] 

     var columns = [ 
      {name:'fruit', cellTemplate: 'fruitsTemplate'}, 
      {name:'alice'}, 
      {name:'bill'}, 
      {name:'casey'}, 
      {name:'average'}, 
      {name:'total'} 
     ] 

     var model = { 
      data: data, 
      columns: columns 
     } 

Answer 1

修复它，我覆盖了太多的模型的东西。

var t = document.querySelector('template') 
    t.addEventListener('template-bound', function() { 
     t.model.data = data 
     t.model.columns = columns 
     var p = document.querySelector('core-drawer-panel') 
     p.togglePanel() 
    }) 

如果每个webcomponent使用相同的模型来配置自身，这可能是一个设计问题？