如何通过其他变量中强调模板 [英] How to pass additional variables in to underscores templates

问题描述

我已经呈现在下划线模板搜索结果骨干观点。至于我想强调的结果我在模板下面的打印方法搜索词：

 打印（someKey.replace（SEARCHTERM，'＆LT; B＆GT;'+ SEARCHTERM +'＆LT; / B＆GT;'）
 

它的工作原理aspected，但我必须设置在全局命名空间的 SEARCHTERM 变量来得到这个工作。我不知道是否有访问print方法我的意见模型的方法，所以我可以写这样的：

 打印（someKey.replace（SEARCHTERM，'＆LT; B＆GT;'+ this.model.get（'SEARCHTERM'）+'＆LT; / B＆GT;'）
 

或者，如果我能在设定SEARCHTERM作为一个局部变量我渲染功能，访问它在我的模板。

下面是整个骨干观点：

  VAR SEARCHTERM;
VAR SearchResultView = Backbone.View.extend（{
    初始化：功能（）{
        this.model.bind（'的变化：行'，this.render，这一点）;
        this.model.bind（'的变化：搜索关键词，this.clear，这一点）
    }，
    模板：_.template（＆LT; TR＆GT;＆LT; TD＆GT;＆LT;％的打印（someKey.replace（SEARCHTERM，'＆LT; B＆GT;'+ SEARCHTERM +'＆LT; / B＆GT;'））;％GT;＆LT; / TD＆GT;＆下; / TR＆gt;中，这一点），
    渲染：功能（）{
       SEARCHTERM = this.model.get（'SEARCHTERM'）
        _.each（this.model.get（行），功能（行）{
            this.el.append（$（this.template（row.doc）））;
        }， 这个）
    }，
    明确：功能（）{
        this.el.empty（）;
    }
}）;
 

解决方案

我不知道我完全理解你的问题。但我沿着这些线路东西向多个对象传递到我的模板功能。

  $（this.el）的.html（_。模板（HTML）（$。扩展（{}，this.model.toJSON（），App.lists.toJSON（） ）））
 

jQuery的扩展功能，让我两个对象合并成一个。所以你的情况，你可以在模板化与模型合并的搜索关键词。

  _模板（HTML）（$扩展（{}，row.doc，{搜索关键词：SEARCHTERM}））。
 

您另一种选择将是整个模型传递到你的模板功能和模板进行的下划线迭代。让我知道如果你需要更多的解释。

编辑：

下面是一个链接到 jQuery的延长

和强调也有和如果你不使用jQuery的扩展方法

编辑编辑：

这是只给你我的第二个建议的一个例子。可能会需要一些调整来扔到你的，但是这是这个想法。

 模板：_.template（    ＆LT;％_（行）。每个（函数（行）{％GT;
        ＆LT; TR＆GT;＆LT; TD＆GT;＆LT;％的打印（someKey.replace（SEARCHTERM，'＆LT; B＆GT;'+ SEARCHTERM +'＆LT; / B＆GT;'））; ％GT;＆LT; / TD＆GT;＆LT; / TR＆GT;
＆LT;％}％GT;），
渲染：功能（）{
    this.el.append（this.template（this.model.toJSON（）））;
}
 

I've a backbone view that renders a search result in a underscore template. As I want to highlight the search term in the result I have the following print method in the template:

print(someKey.replace(searchTerm, '<b>' + searchTerm + '</b>')

It works as aspected, but I have to set the searchTerm variable in the global namespace to get this work. I wonder if there is a way to access my views model in the print method, so I could write it like this:

print(someKey.replace(searchTerm, '<b>' + this.model.get('searchTerm') + '</b>')

Or if I could set searchTerm as a local variable in my render function and access it in my template.

Here is the whole Backbone view:

var searchTerm;
var SearchResultView = Backbone.View.extend({
    initialize: function() {
        this.model.bind('change:rows', this.render, this);
        this.model.bind('change:searchTerm', this.clear, this)
    },
    template: _.template("<tr><td><% print(someKey.replace(searchTerm, '<b>' + searchTerm + '</b>')); %></td></tr>", this),
    render: function() {
       searchTerm = this.model.get('searchTerm')
        _.each(this.model.get('rows'), function(row) {
            this.el.append($(this.template(row.doc)));
        }, this)
    },
    clear: function(){
        this.el.empty();
    }
});

解决方案

I'm not sure that I fully understand your question. But I do something along these lines to pass multiple objects into my template function.

 $(this.el).html(_.template(html)($.extend({}, this.model.toJSON(), App.lists.toJSON())))

The jquery extend function lets me merge two objects into one. So in your case you could merge your "searchTerm" in with your model during templating.

_.template(html)($.extend({}, row.doc, {"searchTerm": searchTerm}))

Your other option would be to pass your entire model into you template function and perform your underscore iteration in the template. Let me know if you need more explanation on that.

EDIT:

Here is a link to jquery extend

And underscore also has and extend method if you aren't using jquery

EDIT EDIT:

This is just to give you an example of my second suggestion. Would probably need some tweaking to throw into yours, but this is the idea.

template: _.template("

    <% _(rows).each(function(row) { %>
        <tr><td><% print(someKey.replace(searchTerm, '<b>' + searchTerm + '</b>')); %></td></tr>
<% } %>

"),
render: function(){
    this.el.append(this.template(this.model.toJSON()));
}

这篇关于如何通过其他变量中强调模板的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！