vaadin-grid 中的聚合物访问元素

Question

说明问题的工作 jsbin：http://jsbin.com/nomewa/3/edit?html,console,output

我正在尝试在构成 vaadin-grid 的模板中设置 notworking span 的 innerHTML。当前似乎无法绑定到 vaadin-checkbox 的 on-change 时说 vaadin-checkbox 位于 vaadin-grid 内，因为我什至无法访问网格中的元素。

Answer 1

这是尝试一些代码的好方法 (jsbin :) 这段代码可以工作，但我不知道它是否适合您的需要。（我只剪切和复制了更改的部分：在属性声明中，您可以将预值设置为 notWorking 属性。然后您可以在函数中动态更改它。

<iron-ajax url="https://randomuser.me/api?results=10" last-response="{{response}}" auto></iron-ajax>
    <span id="working">Working</span>
    <vaadin-grid id="grid" items="{{response.results}}" style="height: auto;">
      <vaadin-grid-column>
        <template class="header">Name</template>
        <template>[[item.name.first]] [[item.name.last]] <span>{{notWorking}}</span></template>
      </vaadin-grid-column>
    </vaadin-grid>
  </template>
  <script>
    class MyTest extends Polymer.Element {
      static get is() { return 'test-component'; }

      ready() {
        super.ready();
        this.set('notWorking',"test")
        debugger;
      }
    }

这里是工作link

Answer 2

It does not currently seems to be possible to bind to on-change of vaadin-checkbox when said vaadin-checkbox lies within vaadin-grid since I cannot even access the element within the grid.

您可以在列模板内使用声明性事件绑定，因此您不必引用实际的标记元素。

像这样：

<vaadin-grid-column>
  <template>
    <vaadin-checkbox on-checked-changed="_myListener">Checkbox</vaadin-checkbo>
  </template>
</vaadin-grid-colum>

vaadin-grid 中的聚合物访问元素

Polymer access elements within vaadin-grid

vaadin

polymer