Question

在underscore.js模板中，有没有办法从点击事件中获取模板的数据？例如：

geocoder.geocode({
                'address' : $(this.el).find("input[name=locationSearchText]").val()
            }, function(results, status) {
                if (results && status && status == 'OK') {
                    this.results = results;
                    var list =_.template("<ul><% _.each(results, function(result){  %><li><%= result.formatted_address %></li><% })%></ul>");
                    $el.find("#search-results").html(list);
                }else{
                    alert("SOMETHING WENT WRONG!");
                }
            });

然后在视图的骨干中：

    events: {
        'click #search-results li': function(data){ 'the data of the `result` that was passed to the template in the each'}
    },

Answer 1

过去我所做的就是将我想要的数据粘贴在元素的data-属性中，如下所示：

var list =_.template("<ul>
    <% _.each(results, function(result){  %>
        <li data-foo=\"<%= result.foo %>\"><%= result.formatted_address %></li>
    <% })%>
</ul>");

在回调中，我可以像这样检索它：

'click #search-results li': function(ev){
    var foo = $(ev.currentTarget).data('foo');
}

但是如果您需要访问整个result对象，而不是将其存储在DOM中，您可以执行与CanJS's element callback类似的操作，其中您使用jQuery.data存储对象关于元素：

this.results = results;
var list =_.template("<ul><% _.each(results, function(result){  %><li><%= result.formatted_address %></li><% })%></ul>");
$el.find("#search-results").html(list).find('li').each(function(i, el) {
    $(el).data('result', results[i]);
});

然后使用$(ev.currentTarget).data('result')在回调中检索它。

下划线/骨干模板事件

1 个答案: