添加班级到聚合物元素

Question

每次选中我的模板中的复选框，我想添加一个班级到我的聚合物元素或更改聚合物元素的属性。

由于我的元素使用label for属性，我绑定的复选框的ID在我的标记实例化元素时

<label for="{{uniqueid}}" on-tap="{{toggle}}" /> 
    <input type="checkbox" id="{{uniqueid}}" class="select" checked="{{checker}}"> 
    <img src="{{image}}" alt="" class="prod-img"> 
    <div class="grid-details"> 
    <span>{{designer}}</span> 
    <span>{{product}}</span> 
    <span>{{currency}} {{price}}</span> 
    <span>Shipped from {{info}}</span> 
    </div> 
</label> 

我会再打电话像这样

<gmselect-element uniqueid="four" image="http://i.imgur.com/fkq1QKq.jpg" designer="CUCARELIQUIA" product="Castellano Suede Bag Redder" info="Gijon, Spain" price="650" currency="$"></gmselect-element> 

我切换元素功能看起来像下面

toggle: function() { 
    this.$.grid.setAttribute("class", "grid true"); 
    this.setAttribute("selected", "true"); 
    } 

但是，instea在这里将它设置为true，我想检查复选框的选中属性的值。由于ID不是静态的，我不能使用$功能获取元素。我也不知道如何逃避胡须中的数据绑定，以在方法中获得它的价值。

Answer 1

您已将checked的值绑定到{{checker}}，因此您应该只能参考toggle函数中的this.checker。

如果需要，还可以从事件中获取模型数据。请参阅：

https://www.polymer-project.org/1.0/docs/devguide/data-binding

Answer 2

this.$.grid.classList.add('classname') 

this.$.grid.classList.remove('classname')