폴리머 요소에 클래스 추가

Question

템플릿 내 체크 상자가 선택 될 때마다 클래스를 폴리머 요소에 추가하거나 폴리머 요소의 특성을 변경하고 싶습니다. 내 요소가 label for 속성을 사용하기 때문에

, 나는

<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> 

내 전환과 같은 요소를 부를 것이다 나의 마크 업 요소를 인스턴스화 할 때 옆에있는 확인란의 ID를 바인딩 함수는 다음과 같습니다.

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

그러나 instea d를 true로 설정 한 경우 확인란의 checked 속성 값을 확인하고 싶습니다. 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')