Question

使用jsbin解释问题：http://jsbin.com/nomewa/3/edit?html,console,output

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

Answer 1

当vaadin-checkbox位于vaadin-grid内时，似乎无法绑定到vaadin-checkbox的on-change，因为我甚至无法访问网格中的元素。

您可以在列tempates中使用声明性事件绑定，因此您不必具有对实际标记元素的引用。

这样的事情：

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

Answer 2

这是尝试一些代码的好方法（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

vaadin-grid

2 个答案: