javascript 如何将附加变量传递给下划线模板

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/8809817/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 04:39:19  来源:igfitidea点击:

How to pass additional variables in to underscores templates

javascriptbackbone.jsclosuresunderscore.js

提问by Andreas K?berle

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 searchTermvariable 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:

它按方面工作,但我必须searchTerm在全局命名空间中设置变量才能完成这项工作。我想知道是否有办法在打印方法中访问我的视图模型,所以我可以这样写:

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.

或者,如果我可以在我的渲染函数中将 searchTerm 设置为局部变量并在我的模板中访问它。

Here is the whole Backbone view:

这是整个 Backbone 视图:

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();
    }
});

回答by Mike

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.

jquery 扩展功能让我将两个对象合二为一。因此,在您的情况下,您可以在模板期间将“searchTerm”与您的模型合并。

_.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

这是jquery 扩展的链接

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

如果您不使用 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()));
}