这也是一个未解决的问题:https://github.com/meteor/meteor/issues/4231
短篇小说
在这里你可以看到问题的演示(按ADD一次,然后按第一个X多次..只有第一个会删除记录。然后尝试使用第二个按钮来解决同一个问题): http://bug-event-template.meteor.com
此处源代码为:https://github.com/brugnara/meteor-bug-event-template
长篇故事
我有一个模板,用于呈现存储在Session
。
你可以尝试自己。按ADD按钮,您将看到一个带有红色标记的项目列表,该项目应该删除当前项目,并且在您第一次按下它时它会起作用。我第二次收到错误,说id不存在。通过检查员,我可以看到data-id=RAND
并且它是正确的。唯一错误的是第二次按下按钮时.data('id')
功能的结果。我真的无法理解发生了什么。这可能是某个地方的错误吗? (请参阅*****签名注释。获取的值是错误的,但其他任何内容都可以正常显示,即DEBUG {{id}}
正确显示,并且检查员显示正确设置的数据ID。在我看来{ {1}}例程在某些时候失败,或者只是我在代码中出现问题:))
感谢您的关注。
管理器:
event
模板
var MESSAGE_QUERIES = 'messages:queries';
var MESSAGE_CURRENT = 'messages:current';
Template.messagesNew.helpers({
queries: function() {
return Session.get(MESSAGE_QUERIES);
}
});
Template.messagesNew.events({
'keyup #message-new-text': function(e) {
var $len = $('#message-new-text-length');
var $text = $(e.target);
var len = $text.val().length;
$len.html(len === 0 ? '' : len + (len === 1 ? ' char' : ' chars'));
},
'click .query-add': function(e) {
e.preventDefault();
var id = chance.word({ length:16 });
var queries = Session.get(MESSAGE_QUERIES);
if (!queries) {
queries = [];
}
queries.push({
id: id
});
Session.set(MESSAGE_QUERIES, queries);
},
'click .btn-remove': function(e) {
e.preventDefault();
e.stopImmediatePropagation();
var $target = Template.instance().$(e.currentTarget);
var id = $target.data('id'); // ************* This is wrong any click but first
TARGET = $target; // for debug only
var queries = Session.get(MESSAGE_QUERIES);
var toRemove = -1;
$target.blur();
//
queries.forEach(function(query, index) {
if (query.id === id) {
toRemove = index;
}
});
if (toRemove === -1) {
return console.warn('Nothing found with id:', id);
}
console.log('Removing query with id:', id, 'in position:', toRemove);
queries.splice(toRemove, 1);
Session.set(MESSAGE_QUERIES, queries);
}
});
谢谢。
答案 0 :(得分:1)
我认为你以错误的方式使用Meteor。您应该了解您所处的数据上下文。
使用{{#each queries}}
,您可以将循环的数据上下文设置为每个元素。
因此,在您的活动'click .btn-remove'
中,您应该可以使用this.id
直接获取ID,而不是使用数据属性。像这样:
{{#each queries}}
<div>
...
<div class="btn-remove">X</div>
</div>
{{/each}}
在模板事件中:
Template.messagesNew.events({
'click .btn-remove': function(e) {
var queryId = this.id; //get the current item id with this.id
//then do whatever you want based on the queryId you got
...
}
});