在 Polymer 中动态创建的行中调用函数

如何解决在 Polymer 中动态创建的行中调用函数

我正在使用模板动态添加一行。在添加行时，我还需要在 Amount 列上使用 on-change="addTotal" 函数。每当新增行的 Amount 列发生变化时，它应该调用 addTotal() 函数，该函数将行的所有值相加并进行总计。但是，使用此代码时，它不会调用 addTotal 函数。

addRow() {
    var template = document.createElement('template');
    template.innerHTML = '<div class="tr" ><div class="td" >' +
        '<vaadin-text-field theme="field-description"></vaadin-text-field></div><div class="td"><div class="td" >' +        
        '<vaadin-text-field theme="field-amount" class="totalcheck" on-change="addTotal"></vaadin-text-field></div><div class="td" ></div>'
 
    var fragment = template.content;
    this.$.Table.insertBefore(fragment,this.$.subTotalRow);

}

addTotal(){
//this adds all values of Amount column
}

我已经尝试在 addRow() 函数中使用类名“totalcheck”的 addEventListener，但这也是未定义的。

document.querySelector('totalcheck').addEventListener('change',function (e) {
            console.log(e.detail); // true
        })