템플릿에서 유성의 js 파일로 가져 오기

Question

헬퍼 함수에서 반환 한 배열에 따라 div 요소를 반복하는 {{#each}} 루프를 사용하고 있습니다. 이제 예를 들어 버튼을 클릭 할 때 첫 번째 요소에서 버튼을 클릭하면 버튼 클릭이 해당 요소의 ID를 반환해야 할 때 요소의 ID를 저장하려고합니다.

  <div class="row"> 
      {{#each db}} 
      <div class="col-md-4"> 
       <a href="#" class="product-name" id="packageSelected">{{ this.title }}</a> 
       <div class="small m-t-xs"> 
        {{this.description}} 
       </div> 
       <button class="btn btn-sm btn-primary" id="packageNext" value="{{this._id}}">Next</button> 
      </div> 
      {{/each}} 
     </div> 

버튼을 클릭하면 버튼이 클릭 된 요소의 ID가 아닌 첫 번째 요소의 ID 만 반환됩니다.

Template.package.events({ 
    'click #packageNext':function(event){ 
     event.preventDefault(); 
     var packageSelected=$("#packageNext").val(); 
     console.log(packageSelected); 
    } 
}); 

제목을 얻기 위해 아래 코드를 사용해 보았습니다.

Template.package.events({ 
    'click #packageNext':function(event){ 
     event.preventDefault(); 
     var packageSelected=$(".m-t-xs").text(); 
     console.log(packageSelected); 
    } 
}); 

Answer 1

는 더 간단한 방법이있다 : 유성 템플릿 이벤트, this는 현재 데이터 컨텍스트 될 것입니다. 그래서 그냥 :

Template.package.events({ 
    'click #packageNext'(event) { 
    console.log(this); // the whole object 
    console.log(this._id); // the _id of the object 
    } 
});