Question

我正在使用{{#each}}循环来迭代div元素，具体取决于辅助函数返回的数组。现在我想在单击按钮时保存元素的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

有一种更简单的方法：在Meteor模板事件中，this将是当前的数据上下文。所以只是：

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

从meteor中的模板到js文件获取值

1 个答案: