在 Polymer 回调函数中访问 div

Question

我有一个基本的 Polymer 应用程序设置（抽屉中有 3 个视图的示例应用程序之一）。我正在尝试在每个视图中动态显示 Google 图表。我在 Polymer ready() 函数中加载 google 个图表，并在 setOnLoadCallback 上传入一个函数。在回调函数中，我尝试创建图表并将其添加到 div，但找不到 div。谁能告诉我我做错了什么？

<div id="chart_div" style="width: 900px; height: 500px"></div>

  <script>
    Polymer({
      is: 'my-view1',
      ready: function() {
        console.log('Polymer ready');

        google.charts.load('current', {'packages':['corechart']});
        google.charts.setOnLoadCallback(this.drawBasic);
      },

      drawBasic : function() {
        console.log('preparing to create chart');

        var chart_div = this.$.chart_div;
        console.log(chart_div);
      }
    });
  </script>

Answer 1

我认为你的错误在这里：

google.charts.setOnLoadCallback(this.drawBasic)

解决此问题的一种方法是使用 bind 方法。 Here 您可以找到有关该方法的文档。所以，我想这会起作用：

google.charts.setOnLoadCallback(this.drawBasic.bind(this))

在 Polymer 回调函数中访问 div

Access div within Polymer callback function

javascript

google-visualization

polymer

polymer-1.0

polymer-starter-kit