在聚合物元素中添加一个类

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");
  }

但是,我不想在此处将其设置为true,而是要检查复选框的checked属性的值.由于ID不是静态的,我无法使用$功能获取元素.我也不知道如何逃避胡子中绑定的数据以在方法中获取其值.

Answer 1

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

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